Frontend Dev (147) 썸네일형 리스트형 Section4 Unit3 [React] 심화 - Virtual DOM과 React Hooks Section4 Unit3 [React] 심화 - Virtual DOM과 React Hooks 📌 Chapter1. React 심화 • React의 Virtual DOM React는 UI의 상태를 추적하고 변화가 일어난 요소들을 빠르게 업데이트할 수 있도록 Virtual DOM이라는 가상의 DOM 객체를 활용한다. 이는 실제 DOM의 사본 같은 개념으로, React는 실제 DOM 객체에 접근하여 조작하는 대신 이 가상의 DOM 객체에 접근하여 변화 전과 변화 후를 비교하고 바뀐 부분을 적용한다. 📌 Chapter2. React Hooks • 렌더링 최적화를 위한 Hook으로 useMemo와 uesCallback이 있다. → useMemo는 값의 재사용을 위해 사용하는 Hook이라면, useCallback.. Section4 Unit2 [솔로 프로젝트] COZ Shopping - 2일차 Section4 Unit2 [솔로 프로젝트] COZ Shopping - 2일차 오늘은 하루종일 챕터 학습 없이 프로젝트만 진행했다. 중간에 자료구조 문제 해설 시간이 잠깐 있기는 했는데, 듣다가 포기해버렸다. 무슨 말인지 1도 못알아듣겠다...ㄷㄷ 일단 지금은 알고리즘 문제는 아닌걸로..🥲 오늘자 글에는 쓸게 없네..? 과제 진행사항은 노션에 따로 정리하고 있고, 나중에 과제가 끝난 후에 블로그에도 글을 쓸지 고민중이다. 어제 챕터학습 하나 정도만 남겨놓을걸 그랬나보다 :-| 이번 프로젝트에서는 다른 사람들과 협업을 한다는 가정하에 이루어지는 건지 main 브랜치에 직접 코드를 작성하는 것을 금지했다. 대신 branch를 만들어 코드 작성 후 pull request 후에 merge 하기를 권장했다. 그래.. Section4 Unit2 [솔로 프로젝트] COZ Shopping Section4 Unit2 [솔로 프로젝트] COZ Shopping 📌 Chapter1. 솔로 프로젝트 본 프로젝트 전에 간단히 진행하는 솔로 프로젝트가 시작되었다. • 스프린트 기간은 5일 (평일만 / 오늘부터 다음주 월요일까지) • 첫 날은 플래닝 데이, 마지막 날은 회고 데이 • 이번 과제는 애자일 방법론과 스크럼보드를 활용한 프로젝트로, 혼자 작업하는 솔로 프로젝트이지만 깃과 깃허브를 적극 활용한다. • 또, 이번 과제는 React를 사용해 주어진 요구사항을 만족하는 상품리스트 페이지, 그리고 사용자가 북마크 한 상품들을 조회할 수 있는 북마크 페이지를 포함하는 SPA 앱을 구현하는 것이 목적이다. • 이번 솔로 프로젝트에서의 나의 목표는, • 깃허브 사용 익숙해지기 (branch, push, p.. Section4 Unit1 [자료구조/알고리즘] 기초 - Tree, Graph Section4 Unit1 [자료구조/알고리즘] 기초 - Tree, Graph 📌 Chapter3. Tree와 Graph 지난 챕터와 마찬가지로 Tree와 Graph도 개인 노션에 우선 정리만 해두었다. 블로그에는 자료구조에 대해 좀 더 관심이 생겨서 공부를 하게 되면 정리를 해서 기록해볼까 싶어서 이번에도 역시 개념만 적어볼까 한다. 특히 이번에는 그래프의 여러 종류와 표현방식 등이 너무 많아서 헷갈리고 어려웠던 것 같다. 그리고 그래프를 탐색하는 방법 중 대표적인 두 가지인 BFS와 DFS도 쉽지 않았다. 여러번 글을 읽다보니 이해는 되었는데, 이걸 내가 응용할 수 있을까? Tree는 그래프의 여러 구조 중 단방향 그래프의 한 구조로, 하나의 뿌리로부터 가지가 사방으로 뻗은 형태가 나무와 닮았다고 해.. Section4 Unit1 [자료구조/알고리즘] 기초 - Stack, Queue Section4 Unit1 [자료구조/알고리즘] 기초 - Stack, Queue 📌 Chapter1. 자료구조 • 자료구조란 여러 데이터의 묶음을 저장하고, 사용하는 방법을 정의한 것 • 자주 등장하는 네 가지의 자료구조: Stack, Queue, Tree, Graph 📌 Chapter2. Stack과 Queue 부트캠프를 통해 Stack과 Queue를 공부하며, 노션에 정리를 해놨는데 블로그에 따로 글을 쓸까 하다가 우선은 보류하기로 했다. 자료구조를 처음 접하기도 했고, 익숙치 않은 개념이라 조금 더 개인 노션에 정리를 해두고 공부를 하는게 좋을 것 같다는 생각이 들었다. 개념정도만 기록해볼까 한다. Stack 데이터(data)를 순서대로 쌓는 자료구조 • Stack은 입력과 출력이 하나의 방향, 즉.. Section3 회고, 일주일 같았던 한 달 Section3 회고, 일주일 같았던 한 달 정말 일주일 같았다. 그 긴 한 달 동안 난 무엇을 했는가. 앞으로도 할 것이 너무 많다는 것에 걱정과 한숨과 피로가 몰려오지만 한편으로는 안도감이 든다. 여전히 달리고 싶음에, 아직 지치지 않았음에, 그래도 재미가 있고, 성취감을 느낀다는 것에 감사한다. 📌 목표: 👩🏻💻 2023년 안에 프론트엔드 개발자로 커리어 시작하기 ✨ Keep _만족스러운 부분, 계속 이어가면 좋을 부분 • 매일 꾸준히 학습하고, 공부했던 내용을 정리하고 기록하는 습관 → 언제든 키워드로 검색할 수 있는 유용함과 편리함! → 이해가 안되는 부분도 일단 복붙 하면 나중에라도 다시 보게 됨 😂 • 하루를 돌아보는 아주 간략한 회고 작성 • 제시간에 출석 • 매일 스트레칭으로 몸 풀어주.. Section3 Unit7 [Backend] 인증 / 보안 - Cookie/Session Section3 Unit7 [Backend] 인증 / 보안 - Cookie/Session 📌 Chapter1. Cookie/Session 웹에서는 사용자의 정보를 어딘가에 저장해야 하는데 HTTP는 상태를 저장하지 않는다. • Cookie 서버에 의해 클라이언트에 저장되는 데이터 파일로 서버에서 클라이언트에 영속성 있는 데이터를 저장하는 방법이다. 서버는 클라이언트의 쿠키를 이용하여 데이터를 가져올 수 있으며, 쿠키를 이용하는 것은 단순히 서버에서 클라이언트에 쿠키를 전송하는 것만 의미하지 않고, 클라이언트에서 서버로 쿠키를 다시 전송하는 것도 포함된다. 쿠키는 로그인 상태 유지, 테마 상태 유지 등 장시간 보존해야 하는 정보 저장에 적합하다. 쿠키는 클라이언트에 데이터를 저장하기 때문에 서버의 부하가 .. mkcert 사용법 - 로컬 개발을 위한 HTTPS 환경 만들기 ✏️ 로컬 개발을 위한 HTTPS 환경 만들기 (mkcert 사용법) 1. mkcert를 이용하여 로컬에서 신뢰할 수 있는 인증서 만들기 2. mkcert로 발급받은 인증서를 이용해 HTTPS 서버 구축하기 📌 mkcert: https://github.com/FiloSottile/mkcert 💬 mkcert는 코드스테이츠 프론트엔드 부트캠프 3개월차 쯤, 네트워크 유닛에서 접하게 되었다. 처음 들어보고, 처음 사용해보는거라 너무 헷갈리는데 학습자료를 보고 따라해도 잘 되지 않았다. 구현 도중 발생한 에러의 문제가 무엇인지 모른채 시간을 많이 보내서 과정을 기록해보려 한다. 참고로 MacOS 에서의 사용법만 기록한다. • 참고자료: 코드스테이츠SEB 학습자료, https://web.dev/how-to-us.. 이전 1 ··· 4 5 6 7 8 9 10 ··· 19 다음
