DOCSEARCHbyAlgolia
Submit Docs

Total Study Documentation

website·Indexed 30 days ago

https://hyungju-lee.github.io/TOTAL_STUDY/

A comprehensive collection of study guides and examples covering various technical topics, including JavaScript, Vue.js, React, Java, Jenkins CI/CD workflows, and foundational Computer Science concepts such as computer architecture and networking.

Tokens
11.6K
Snippets
30
Records
82
Agent score
75%

What's inside Total Study

  1. Overview of Jenkins CI/CD Tool

    Jenkins is an open-source CI/CD tool developed in Java. It provides automation for the software development lifecycle, specifically focusing on:

    • Build Automation: Compiling source code, running unit tests, and packaging.
    • Test Automation: Testing built code and providing feedback.
    • Deployment Automation: Deploying packaged code to production or test servers.

    Key advantages include its open-source nature (free with extensive community references), flexibility to integrate with build tools (Maven, Gradle) and version control systems (Git, SVN), and high extensibility via a vast plugin ecosystem.

  2. Introduction to Vue.js

    Vue.js is a JavaScript framework used for building interactive and reactive web frontends. It allows developers to create user interfaces that update in real-time based on user input without requiring a full page reload. By providing a structured set of rules and reusable code, Vue.js reduces repetitive boilerplate and improves team collaboration through consistent coding patterns.

  3. Overview of Jenkins for CI/CD

    Jenkins is an open-source automation server optimized for CI/CD (Continuous Integration and Continuous Delivery) workflows. It supports a wide range of programming languages and integrates with various infrastructure and deployment tools, including Tomcat, Docker, Kubernetes, and Infrastructure as Code (IaC) tools.

  4. Understand Reverse Proxy functionality and benefits

    A reverse proxy acts as an intermediary server that receives requests from clients and forwards them to backend servers, then returns the backend's response to the client. It is commonly used as a web server, load balancer, or security device.

    Key functions include:

    • Load Balancing: Distributes traffic across multiple backend servers to improve performance and availability.
    • Security Enhancement: Adds a security layer between clients and backends, providing SSL/TLS encryption and DDoS protection.
    • Caching: Stores static content (images, CSS) to reduce backend load and speed up responses.
    • IP Masking: Hides the IP addresses of backend servers from the client.
    • SSL Termination: Decrypts SSL requests at the proxy level to reduce the computational burden on backend servers.

  5. Understand the difference between Imperative (JavaScript) and Declarative (React) programming

    Standard JavaScript applications typically use imperative code, which can become difficult to maintain as complexity increases. In contrast, React applications use a declarative approach, making the codebase easier to maintain even as the application grows in complexity.

  6. Technical stack used for custom SSG blog implementation

    The blog was built from scratch without a framework (avoiding SSG frameworks like Gatsby or VuePress) to allow full customization. The following technical stack was used for implementation:

    • Markdown Parsing: marked
    • Code Highlighting: prismjs
    • Image Optimization: sharp
    • Minification/Uglification: terser
    • Metadata: front-matter (YAML)
    • Search Indexing: lunr.js
    • Package Management: pnpm (Monorepo)
    • CI/CD: GitHub Actions
    • SEO: Robots.txt and Sitemap

  7. Understand the JavaScript Call Stack

    The Call Stack is the mechanism JavaScript uses to manage function execution. When a function is called, it is pushed onto the stack; when it returns, it is popped off. This ensures functions are executed in the correct order (LIFO - Last In, First Out).
    function first() {
  second();
  console.log('first');
}
function second() {
  third();
  console.log('second');
}
function third() {
  console.log('third');
}
first(); // Execution order: third -> second -> first

  8. Understand basic computer architecture and the data processing cycle

    Computer architecture defines how a system processes, stores, and transmits data. The core hardware components include:

    • Input Devices: Allow users to enter data (e.g., keyboard, mouse).
    • Output Devices: Deliver processed data to the user (e.g., monitor, printer).
    • Central Processing Unit (CPU): The 'brain' that performs all data processing. It consists of a Control Unit (CU) for coordination and an Arithmetic Logic Unit (ALU) for calculations.
    • Memory: Stores data for CPU access. It is categorized into Volatile (data lost when powered off, e.g., RAM) and Non-Volatile (data persists, e.g., SSD, HDD).

    The Data Processing Cycle:

    1. Input: Data is received via input devices.
    2. Storage: Data is held in memory for fast CPU access.
    3. Processing: The CPU performs arithmetic (addition, subtraction) or logical (AND, OR) operations.
    4. Output: Results are sent to output devices.
    5. Workflow Control: The Control Unit manages the timing and sequence of these steps.

  9. Understand the JavaScript Event Loop and Asynchronous Execution

    JavaScript handles time-consuming tasks asynchronously using an Event Loop. The execution flow involves four main components:

    1. Call Stack: Manages function calls. Functions are pushed onto the stack when called and popped off when execution completes.
    2. Background: Where asynchronous tasks (like timers or API calls) are processed.
    3. Task Queue: A holding area for callback functions from completed asynchronous tasks. These wait until the Call Stack is empty.
    4. Event Loop: Monitors the Call Stack; when the stack is empty, it moves the first available callback from the Task Queue to the Call Stack for execution.
    console.log('시작');

setTimeout(function run() {
  console.log('3초 후 실행');
}, 3000);

console.log('끝');
// Output: 시작 -> 끝 -> (after 3s) 3초 후 실행

  10. Understand CI/CD concepts and roles

    CI/CD is a critical process in software development consisting of two main components:

    1. Continuous Integration (CI): The process of frequently merging developer code into a shared repository and running automated tests. This reduces merge conflicts and improves code quality through automated build and test cycles.
    2. Continuous Deployment/Delivery (CD): The process of deploying packaged code to various environments (Dev, Test, Prod).
      • Continuous Delivery: Final deployment to production is triggered manually.
      • Continuous Deployment: The entire process from integration to production is fully automated.

    Key Benefits:

    • Automation: Reduces manual errors and saves development time.
    • Fast Feedback: Allows for rapid discovery and fixing of bugs.
    • Higher Quality: Ensures code stability via unit tests and validation.
    • Collaboration: Minimizes conflicts when multiple developers work on the same codebase.

  11. Use Destructuring Assignment for Arrays and Objects

    Destructuring allows you to extract values from arrays or properties from objects into distinct variables. This can be applied to variable declarations and function parameter lists. Key features include setting default values, nested destructuring, and using the rest syntax (...) to collect remaining elements.

  12. Install Jenkins using Docker

    Jenkins can be deployed quickly using Docker. To ensure data persistence, use a Docker volume to map the internal Jenkins home directory to a location on the host machine. This prevents data loss when the container is deleted.

    Deployment Steps

    1. Pull the official Jenkins image (e.g., the LTS version with JDK 17).
    2. Run the container with port mapping for the web UI (8080) and agent communication (50000).
    3. Use the -d flag to run the server in the background (detached mode).
    # Pull the official Jenkins LTS image with JDK 17
docker pull jenkins/jenkins:lts-jdk17

# Run Jenkins container
# -d: Detached mode (background)
# -v: Mounts 'jenkins_home' volume to /var/jenkins_home for data persistence
# -p: Maps host port 8080 to container port 8080 (Web UI)
# -p: Maps host port 50000 to container port 50000 (Agent communication)
# --restart=on-failure: Automatically restarts container if it crashes
# --name: Assigns a friendly name to the container
docker run -d \
  -v jenkins_home:/var/jenkins_home \
  -p 8080:8080 \
  -p 50000:50000 \
  --restart=on-failure \
  --name jenkins-server \
  jenkins/jenkins:lts-jdk17