📍참고 https://docusaurus.io/docs/installation Installation | Docusaurus How to install Docusaurus locally, and start a Docusaurus site in no time. docusaurus.io 📍설치 npx create-docusaurus@latest my-website classic --typescript 📍프로젝트 구조 개요 ✅/blog/ - 블로그 포스트용 md 파일을 포함 - 블로그 플러그인을 사용하지 않는다면 삭제해도 됨 ✅/docs/ - 문서용 md 파일을 포함 - sidebar.js 파일을 수정하여 문서 순서를 수정 가능 - 문서 플러그인을 사용하지 않는다면 삭제해도 됨 ✅/src/ - md 파일이 아..

📍문제 링크 https://www.acmicpc.net/problem/11048 11048번: 이동하기 준규는 N×M 크기의 미로에 갇혀있다. 미로는 1×1크기의 방으로 나누어져 있고, 각 방에는 사탕이 놓여져 있다. 미로의 가장 왼쪽 윗 방은 (1, 1)이고, 가장 오른쪽 아랫 방은 (N, M)이다. 준규는 www.acmicpc.net 📍알고리즘 분류 - 다이나믹 프로그래밍 📍문제 풀이 사탕이 R행 C열의 좌표평면에 몇 개씩 놓여져 있다 1행 1열에서 출발하여 R행 C열 까지 이동한다고 할때 경로를 지나며 획득할 수 있는 사탕의 최대 갯수를 구하면 된다 이때, 이동할 수 있는 방향은 3시 방향, 5시 방향, 6시 방향의 3개이다 R+1 * C+1 크기의 memoization 이차원 배열을 그리고, 직전..

이펙티브 타입스크립트 (댄 밴더캄 지음) 를 읽고 정리 📍요약 ✅코드의 구석구석까지 정확한 타입 안전성을 얻기 위해 API 또는 데이터 형식에 대한 타입 생성을 고려해야 한다 ✅데이터에 드러나지 않는 예외적인 경우들이 문제가 될 수 있기 때문에, 데이터보다는 명세로부터 타입스크립트 코드를 생성하는 것이 좋다

React Docs (beta) 번역 및 정리더보기Built-in React APIs1. createContext2. forwardRef 📍비디오 재생 및 중지하기 예제- 예제https://beta.reactjs.org/reference/react/forwardRef#examples forwardRefA JavaScript library for building user interfacesbeta.reactjs.org video element는 자체 메서드로 play() 와 pause() 를 갖는다App 컴포넌트와 video element가 있는 MyVideoPlayer 컴포넌트가 있다고 가정할 때, App 컴포넌트에서 직접 video element에 접근하게 해보자 ✅MyVideoPlayer.jsimp..

📍문제 링크 https://www.acmicpc.net/problem/3190 3190번: 뱀 'Dummy' 라는 도스게임이 있다. 이 게임에는 뱀이 나와서 기어다니는데, 사과를 먹으면 뱀 길이가 늘어난다. 뱀이 이리저리 기어다니다가 벽 또는 자기자신의 몸과 부딪히면 게임이 끝난다. 게임 www.acmicpc.net 📍알고리즘 분류 - 구현 - 자료 구조 - 시뮬레이션 - 덱 - 큐 📍문제 풀이 - 가상의 좌표평면에서 사과 위치의 좌표 리스트, 방향 전환 (turn left, turn right)이 발생하는 시간 리스트가 주어진다 - 뱀이 1행 1열에서 시작하여 우측방향으로 1초마다 움직인다, 사과를 먹을 경우 길이가 1칸 늘어난다 - 벽에 부딪히면 게임이 끝난다 - 자기 몸체에 부딪히면 게임이 끝난다 ..

이펙티브 타입스크립트 (댄 밴더캄 지음) 를 읽고 정리 📍요약 ✅타입 안전성에서 불쾌한 골짜기(uncanny valley)는 피하는 것이 좋다 타입이 없는 것보다 잘못된게 더 나쁘다 - 불쾌한 골짜기 : 어설프게 완벽을 추구하다가 역효과가 나는 것 - 로봇공학, 인공지능 분야에서 어설프게 완벽을 추구하는 로봇, 인공지능에서 느껴지는 불쾌함에서 유래 ✅타입 정보를 구체적으로 만들 수록 언어 서비스(오류 메시지와 자동 완성)도 신경써야 함 언어 서비스는 개발 경험에 중요 📍추상적인 타입을 구체화하기 - 경도 (column), 위도 (row) 정보를 타입 모델링 - 좌표를 number[] 대신 구체적으로 튜플 [number, number] 로 표현했다 type GeoPosition = [number, numb..

React Docs (beta) 번역 및 정리더보기Built-in React APIs1. createContext2. forwardRef 📍forwardRef✅컴포넌트가 특정 DOM 노드를 ref를 가진 부모 컴포넌트에게 노출하게 해준다즉, useRef로 만든 ref가 props로 타고 내려와 매개변수로 받아 지정할 DOM node를 활용하기 위한 기능const SomeComponent = forwardRef(render) 📍forwardRef(render)✅forwardRef를 호출하여 컴포넌트가 ref를 받아 자식 컴포넌트로 전달하게 한다import { forwardRef } from 'react';const MyInput = forwardRef(function MyInput(props, ref)..

원티드 프론트엔드 프리온보딩 (22.12.19 월 ~ 23.01.20 금) 📍소프트웨어 테스트란? 예전에는 개발자는 개발만 담당하고, 테스트는 별도의 테스트팀이 맡았으나, 최근에는 개발자가 자동화된 테스트를 이용해 소프트웨어 테스트까지 맡는 것이 보편화됨 ✅자동화된 테스트의 이점 1. 컴퓨터가 실행하므로 사람보다 빠름 2. 정해진 스크립트에 따라 일관성있게 동작하므로 human error를 줄일 수 있다 3. 개발중에 빠른 피드백을 받을 수 있다 (TDD) ⭐개발 생산성 향상 가능! 📍소프트웨어 테스트 종류 1. Unit Test (유닛 테스트) - 가장 low-level 테스트 - 가장 작은 범위를 테스트 - 개별 함수, 메서드, 클래스, 컴포넌트 등의 동작을 테스트 2. Integration Test..