본문 바로가기

분류 전체보기

 (101)
[Wanted] 2월 프리온보딩 프론트엔드 ✅ 사전과제 1. SSR과 CSR에서의 주요 차이점은 무엇인가요? 2. React와 Next.js중 어떤 상황에서 각각을 선택해야 하나요? 3. PWA를 구현할 때 Service Worker의 역할은 무엇인가요? 4. SSR, CSR, SPA, PWA, Electron등 다양한 전략이 있는데, 각 전략들은 어떤 상황에 사용되는 것이 적합하며 비즈니스에 어떤 이점을 가져다줄까요? ✅ 1일차: SPA ✅ 2일차: SSR vs CSR ✅ 3일차: PWA ✅ 4일차: Electron
[노마드코더] React Hooks https://www.youtube.com/watch?v=G3qglTF-fFI&list=PLZ5oZ2KmQEYjwhSxjB_74PoU6pmFzgVMO&index=1 ✅ useState초기값이 연산이 많이 필요하다면콜백함수를 사용하여 return하자.=> 렌더링이 한번만 일어남.const Init = () => { const heavyCost = "오래걸리는 작업"; return heavyCost;};const App = () => { const [value, setValue] = useState(Init()); }; ✅ useEffectMount: 화면에 첫 렌더링Update: 다시 렌더링Unmount: 화면에서 사라질 때 deps: dependency array 1. useEffect 인자..
[Git] Issue, PR, git branch 전략 git: 소프트웨어 버전관리시스템 (VCS) github: git을 사용하는 프로젝트를 공유하기 위한 플랫폼. ✅ Lifecycle - Local Workspace:Untracked: 깃이 관리하지 않는 파일tracked: 깃이 관리하는 파일 (git add 이후) - Staging AreaStaged: add 된 파일 (commit 준비가 된 상태)Modified: 마지막 commit 이후 수정사항이 발생한 파일 - Local RepositoryUnmodified: 마지막 commit 이후 변경되지 않은 파일 - Remote Repository - add: Staging Area에 추가Local Workspace : Untracked, Modified - commit: Local Rep..
[노마드코더] React Custom Hooks ✅ 비구조화 할당, 구조 분해: event를 다른 함수로 분리할 수 있다. Ex) 이벤트를 분리한 파일, 다른 entity에 연결하여 처리할 수 있음.const useInput = (initialValue) => { const [value, setValue] = useState(initialValue); return { value };};const App = () => { const name = useInput("Mr."); return ( Use Hooks );};=> useInput이 반환하는 모든 것을 ...name을 통해 풀어준다.(packing/unpacking) 💯💯💯 객체의 비구조화 할당const { newValue } = e;con..
[Wanted] 프리온보딩 2월 프론트엔드 라이프 사이클 단계 1. 초기화 단계(Initialization) 2. 뷰 렌더링 단계(View Rendering) 3. 이벤트 처리 단계(Event Handling) 4. 데이터 업데이트 단계(Data Update) 5. 종료 단계(Termination) Javascript 코드의 길이가 방대한 경우 초기 로딩 시간이 길어진다. 따라서, SPA의 단점을 보완하기 위해 코드 분할을 한다. 코드 분할: 애플리케이션의 번들을 여러 청크로 분리한다. 필요한 코드만 제공 Lazy Loading: 필요한 코드만 렌더링 브라우저 캐싱 ETag
[Docker] 도커 특강 키워드 Host OS, Guest OS, 쿠버네티스 # 가상화 물리적으로 운영하는 비용이 많이 들기 때문에 여러 서버 환경을 하나의 PC에서 사용할 수 있도록 한다. => 할당받은 리소스 이상을 사용할 수 없다. # 하이퍼바이저 가상화 (VM) : 하이퍼바이저(하나의 커널)를 통해 Host OS와 Guest OS가 system call을 주고 받아 interaction한다. 장점 1. 머신들과의 완전한 독립 단점 1. 하이퍼바이저 자체가 하나의 커널이기 때문에 무겁다. 배포하기 쉽지 않다. # 컨테이너 가상화 컨테이너: Docker가 아닌 리눅스 컨테이너에서 파생된 개념이다. 배포, 환경을 규격화 시켰다. 장점 1. 컨테이너는 독립적이다. 2. Host OS의 커널을 컨테이너가 공유하여 사용하기에 가볍다..
[백준] B13022 수정 Q. https://www.acmicpc.net/problem/13022 13022번: 늑대와 올바른 단어첫째 줄에 단어가 주어진다. 단어는 w, o, l, f로만 이루어져 있으며, 길이는 50을 넘지 않는다.www.acmicpc.net # 아이디어1. HashSet을 활용하여 단어를 입력받으므로 중복되지 않고 'w', 'o', 'l', 'f' 만 존재해야 한다.2. 단어 길이는 항상 4의 배수여야 한다.3. 모든 단어의 개수는 동일해야 하며, 순서가 지켜져야 한다. Sol1.아이디어 3의 순서가 지켜져야 한다는 부분에 문제가 있는 것 같다...하지만, 왜 틀린지 반례를 못 찾겠네..???import java.util.*;public class Main { public static void main..
[백준] B1978 Q. https://www.acmicpc.net/problem/1978 1978번: 소수 찾기첫 줄에 수의 개수 N이 주어진다. N은 100이하이다. 다음으로 N개의 수가 주어지는데 수는 1,000 이하의 자연수이다.www.acmicpc.net # 아이디어1000이하의 자연수이기 때문에 1~1000 사이의 자연수에 대해서만 생각하면 된다.소수는 1과 자신으로만 나누어 떨어지는 숫자이기 때문에, 2부터 시작해서 1000까지 나누어 떨어지는지 확인하면 된다. Sol2. 처음엔 배열에다가 숫자를 입력받았는데 그냥 입력 받을 때 소수를 판별할 수 있어서 for문을 하나로 합쳤다.import java.util.Scanner;public class Main { public static void main(Str..

티스토리툴바