Next.js 13 version의 렌더링 방식 v12에서 '페이지' 단위로 렌더링 방식을 규정했다면 v13부터는 server component, client component의 개념을 도입하여 '컴포넌트' 단위로 렌더링 방식을 규정함 🗄 Server compone
Next.js는 리액트 기반의 프레임워크로 웹 애플리케이션을 만드는 데 필요한 전체적인 솔루션을 제공한다. 기본적으로 React로 만든 애플리케이션은 SPA로 간주하는데 이는 Client Side Rendering 방식을 채택한다. Next.js를 사용하면 Server
useNavigate를 경로 이동 시에만 사용했던 과거의 나..🥲물론 잘못된 것은 아니지만 useNavigate를 데이터를 전달하는 목적으로도 사용하여 조금 더 효율적으로 코드를 작성할 수 있다는 사실을 배웠다.useNavigate()를 기존에 사용했던 방식(예시)u
메인 프로젝트와 마지막 잡서칭 기간을 지나며 6개월의 여정이 막을 내렸다. 부트캠프의 꽃인 프로젝트 기간을 거치며 치열하게 공부하고 팀원들과의 크고 작은 갈등을 거치며 하드 스킬 뿐만 아니라 소프트 스킬도 기를 수 있어 그 어느 때보다 의미있는 시간을 보내었던 것 같다
프로젝트 전 마지막 섹션 회고 본격적인 프로젝트에 들어가기 전 마지막으로 지금까지 부트캠프에서의 시간들을 솔직하게 회고해보고 다시 새로운 마음으로 프로젝트에 들어가려한다! 👩🏻💻 나의 최종 목표 나만의 속도를 가진, 마음에 여유가 있는 개발자 되기🛫 스스로
CORS(Cross-Origin Resource Sharing, 교차 출처 리소스 공유): 추가 HTTP 헤더를 사용하여 한 출처에서 실행 중인 웹 애플리케이션이 다른 출처의 선택한 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제출처: URL의 스키마
[최적화]Optimization 🔆 Optimization > 최적화란❓ : 주어진 조건으로 최대 효율을 낼 수 있도록 하는 것 컴퓨터 공학에서의 최적화 : 가능한 적은 리소스를 소모하면서 가능한 한 빠르게 원하는 결과를 얻을 수 있도록 하는 것 웹 개발에서의 최
[Testing]TDD 🔆 TDD 방법론 TDD(Test-driven Development)🖍 : 코드 작성 전 테스트를 사용하는 소프트웨어 개발 방법론으로 개발자가 원하는 코드 결과를 미리 정의한 후 이를 바탕으로 코드를 작성하는 방법 🔆 React와 TDD R
GraphQL📈: 페이스북에서 개발해 오픈 소스로 제공된 쿼리 언어Server API를 통해 정보를 주고받기 위해 사용하는 Query Language→ API를 위한 쿼리 언어트리 구조로 쿼리 결과를 받기 위해 그래프를 탐색하는 언어GraphQL의 전제모든 데이터가
[React]심화 🔆 Virtual DOM Virtual DOM > Virtual DOM이 나오게 된 배경🤔 실제 DOM은 스크립팅 언어가 접근 및 탐색하는 속도가 빨라 탐색 후 변경 및 업데이트하는 속도는 역시 빠르다. 하지만 JavaScript로 조작하는 DOM
[React]번들링과 웹팩 🔆 번들링 > #### 번들링🗃 : 여러 제품이나 코드, 프로그램을 묶어 패키지로 제공하는 행위 번들: 사용자에게 웹 애플리케이션을 제공하기 위한 파일 묶음 번들링의 필요성 변수 간 충돌 방지 번들 파일 용량 압축 사용자 임의 조작 방지
[HTML/CSS]심화 🔆 브라우저 > #### 브라우저❓ 브라우저(웹 브라우저)란 웹 서버에서 쌍방향으로 통신하며 HTML 문서 및 그림, 멀티미디어 등의 컨텐츠를 열람할 수 있게 해주는 GUI 기반의 소프트웨어 프로그램이다. 쉽게 말하자면 웹 서버에 접속하여 다양
[자료구조/알고리즘]기초 🔆 자료구조 > #### 자료구조🗂 자료구조란 여러 데이터의 묶음을 체계적으로 정리하여 저장하고 활용하는 방법을 정의한 것을 의미하는데 한마디로 말하자면 데이터를 효율적으로 다루는 방법을 정의한 것이다. 데이터: 문자, 숫자, 소리, 그림,
[Backend]인증/보안 🔆 Cookie/Session > #### Cookie🍪 Cookie란 서버가 클라이언트에게 전달하는 작은 데이터로 쿠키를 이용해 서버가 클라이언트에 영속성 있는 데이터를 저장하고 원한다면 클라이언트의 쿠키를 이용하여 데이터를 가져올 수
[네트워크] 심화 🔆 TCP/IP 네트워크의 시작 네트워크 구축 방식 : 회선교환 방식과 패킷교환 방식 > 회선교환 방식❓ 회선교환 방식이란 발신자와 수신자 사이에 있는 오퍼레이터가 통신 시작 전 미리 전용 회선을 설정해야하는 네트워크 방식을 말한다. 통신 중에서는
웹 표준 & 웹 접근성 🔆 웹 표준 웹 표준의 개념 > Web이란❓ Web이란 인터넷에 연결된 컴퓨터를 통해 사용자들이 정보를 공유할 수 있는 하나의 '공간'을 말한다. 즉, 문서나 이미지, 영상 등의 다양한 정보를 여러 사람들과 공유할 수 있는 공간이다. World
[React]상태 관리 상태 관리 🔆 전역 상태 관리 > #### 상태🧐 상태(state)란 UI에 동적으로 표현될 데이터를 의미한다. 즉, 보여지는 화면에서 변화될 수 있는 데이터를 의미하는데 이 때 state는 props를 통해 전달되지 않으며 시간이 지나 변화
[React]Custom Component 🔆 Component Driven Development > #### CDD🧐 CDD란 컴포넌트를 중심으로 개발 프로세스를 고정하는 개발 방법론이라고 하는데 이게 무슨 뜻일까? 쉽게 말하자면 컴포넌트 단위에서 시작해 컴포넌
UI/UX 🔆 UI/UX 개념 > #### UI📱 UI(User Interface, 사용자 인터페이스)란 사용자들이 컴퓨터와 상호작용하는 시스템을 말한다. 화면 상의 그래픽 요소들은 물론 사용자들이 키보드나 마우스와 같은 물리적 요소를 통해서도 컴퓨터와 소통할 수