firebase클라우드 서비스🕵️‍♀️firebase란?보통 Front-end <-> Back-end <-> DB 로 서버를 구축하고 데이터를 주고 받는다. 하지만, firebase를 사용하면 서버 없는 개발을 가능하게 하기 때문에 백엔드 없이도 웹 서비스

webpack라이브러리 설치접근성🕵️‍♀️ 웹팩이란?모던 JavaScript 애플리케이션을 위한 모듈 번들러이다. 웹 애플리케이션을 구성하는 자원(HTML, CSS, JavaScript, Images 등)을 모두 각각의 모듈로 보고 이들을 조합해서 하나의 결과물로 만

TDD1-1 Jasmine1-2 Jest(React)면접 대비🕵️‍♀️ TDD 란?테스트 주도 개발이라는 뜻으로 말그대로 테스트 코드를 먼저 작성하여 의도한대로 동작하는지 확인한 뒤에 기능을 구현하는 개발 프로세스이다.✍ TDD 단계1\. 실패하는 작은 단위 테스트

SEO1-1 구글 검색 작동 방식1-2 SEO 기본 가이드면접 대비🕵️‍♀️ SEO 란?검색 엔진 최적화라는 뜻이다. 구글 검색, 네이버 검색 등 다양한 검색엔진에 제작한 사이트를 빠르게 상위에 노출시키는 방법들을 웹사이트에 적용하는 것을 검색엔진 최적화라고 한다.✍

Git 장애 대응팀 프로젝트A, B, C 라는 사람이 있고 각자 clone을 받아 작업을 할 때, 순서대로 push 한다면 C에서 오류가 발생한다.B push 이후 C에서 pull, push를 했다면 문제될 부분이 없다.즉, 오류 원인은 A, B에서 작업한 내용이 C에

Github1-1 branch1-2 실습 문제브랜치는 독립적인 작업을 할 수 있는 공간이다. 즉, A 기능을 a 브랜치에서 개발하고 B 기능을 b브랜치에서 각각 개발할 수 있다.main branch : \-readme 파일 'hello world'a branch

면접 질문 대비✍ 기술 면접 질문1\. DTD란 무엇인가요?2\. GET, POST 방식에 대해 설명해주세요.3\. CSS Sprite 기법에 대한 정의와 장단점에 대해 설명해주세요.4\. 형상관리도구(버전 관리 시스템)에 대해 전반적인 설명을 해주세요.(주 5\. p

코딩 테스트 문제면접 질문 대비카카오 2020년 공채문제로 프로그래머스 lv.4 문제이다. 트라이 알고리즘을 모르는 상태에서 풀이를 보고 트리 형태와 유사하다는 느낌을 받았다.프로그래머스 문제 링크🕵️‍♀️ Trie 란? 문자열을 저장하고 효율적으로 탐색하기 위한 트

React1-1 Redux1-2 Axios지난 포스팅의 연장인 Redux이다. 다만, 지난 포스팅에서는 Vanilla JS에서의 Redux 사용이고, 이번 포스팅의 주제는 React에서의 Redux사용이다.✍ React에서 Redux 사용Type을 생성하는 함수초기값

코딩 테스트 문제를 풀다가 갑자기 의문이 생겼고 너무나도 당연한 답에 의문이 해결되어 실소하면서 블로그에 작성하고 있다.🤭내가 떠올린 의문은 코딩 테스트 문제를 해결하면서 동기적으로 결과를 반환 받아 처리해야 될 때가 있는데 "왜 Promise, async, awai

김태곤님 특강figma 특강오전에는 현 Automattic 소속이신 김태곤님의 "프론트엔드 개발자로 취업하기 전에 알았으면 좋았을 것들" 이라는 주제로 특강이 있었다. 실례일 수 있지만, 친한 형이 몇년 더 살아 본 입장에서 진심으로 조언해주는 느낌의 특강이었다.가장

Redux🕵️‍♀️Redux란?state 상태 관리 라이브러리이다. 즉, React의 useState, useEffect 처럼 데이터들의 값이 바뀌었을 때 그 값들을 컴포넌트들에게 전달해주고 그 값들을 다시 화면에 보여준다.💬 지금까지의 오해React와 Redux는

📖 오늘 학습 뽀인트! React 1-1 useContext 1-2 Lifecycle, Hook Flow 1-3 useEffect와 useLayoutEffect 1-2 LifeCycle, Hook Flow > 🕵️‍♀️ React의 생명 주기란? LifeCycle

React1-1 Route에서 match1-2 useEffect1-3 useRef1-4 useMemo1-5 정리1-6 useEffect와 useMemomatch는 보통 동적인 URL를 렌더링할 때 사용한다.path="/blogdetail/:id" 에서 /:변수명은 동적

React1-1 개념 복습1-2 React 과제💬 React에서 재랜더링 되는 기준 3가지1\. 해당 컴포넌트가 가진 변수가 useState로 수정될 때.2\. 해당 컴포넌트의 부모가 재랜더링 될 때.3\. 해당 컴포넌트의 props가 변경되었을 때.💬 컴포넌트는

🕵️‍♀️ 모놀리식 아키텍처란?1개의 애플리케이션 또는 서버로 운영되는 아키텍처를 말한다. 위 사진은 2015 배민의 모놀리식 아키텍처이다. 굉장히 많은 시스템을 하나의 루비 DB로 관리하고 있었다. 이러한 모놀리식 아키텍처는 DB 하나가 죽는 순간 전체 시스템이 마

Git 브랜치 전략에는 크게 두 가지가 있다.첫 번째는 Git-flow 전략이고 두 번째는 Github-flow 전략이다.두 가지 전략에 대한 개념과 사용법을 아래 설명하고자 한다.🕵️‍♀️ Git-flow 전략이란?5가지 브랜치(main, develop, featu

CSS in JS 단어 그대로 자바스크립트 코드에서 CSS를 작성하는 방식을 말합니다. 리엑트 훅(중요) Hook을 이용하여 기존 Class 바탕의 코드를 작성할 필요 없이 상태 값과 여러 React의 기능을 사용할 수 있습니다. 16.8 version에 도입 us

React1-1 useState🕵️‍♀️ useState란?변수 값이 바뀌는 경우, 변경된 값을 동적으로 화면에 보여줘야 할 때 사용한다.num이라는 변수와 setNum이라는 함수가 선언되었고, 초기값이 설정되었다.setNum(1)로 num의 값을 변경할 수 있으며,

React1-1 위니브 사이트 (with React)1-2 프로젝트 생성 및 배포body 라는 변수에 JSX 형식으로 Main, Product 함수의 결과를 넣는다.위 소스코드에는 data라는 객체가 없지만 있다고 가정하고 Product 함수에item이라는 변수에 da