React8 window.localstorage 리액트 프로젝트를 하던중 state에 넣고 사용하던 값들을 window.localstorage에 넣고 사용할 필요가 생겼다. window.localstorage란? - server가 아닌 client단 (web browser)상에 저장하고 사용해도 상관없는 데이터를 저장할 수 있는 기술인 웹 스토리지(web storage)의 일종. ➡️ 웹 스토리지(web storage) 객체는 네트워크 요청 시 서버로 전송되지 않기 때문에 쿠키보다 더 많은 자료를 보관할 수 있다! - 웹 스토리지에는 localstorage와 sessionstorage가 있는데 localstorage의 브라우저나 OS가 재시작하더라도 데이터가 만료되지 않고 sessionstorage의 데이터는 페이지 세션이 끝날때 사라진다. - loc.. 2022. 3. 22. react portfolio 완성 2022.01.21 react 개인 portfolio 완성. 12월 react공부 시작 후 한달여 만이다. 계속 여기에 매달린건 아니고 회사에서 자투리 시간+주말 자투리 시간등을 이용해 만들었다. 만든 앱은 로그인+간단한 일기장 형식의 todo app. CRUD기능을 연동해 만들어서 실제 test db와 연결했다. 디자인 css등은 인터넷등을 참조했기에 블로그에는 완성본을 올리지 않을 예정이다. 애초에 그냥 개인 연습용으로 만들어 본 것이라서. 시간여유가 되면 좀더 다듬어서 github에 올리던 개인 portfolio에 넣을까한다. React로 간단한 앱을 만들어 보면서 느낀점은: 1. component형식으로 구조를 나눠서 독립적으로 각 module을 나눠놓으면 코드를 작성하기가 수월하다. 2. bac.. 2022. 1. 21. React font awesome icon 추가 리액트에서 font awesome icon을 사용하는 법을 알아보자 npm명령어로 shell에서 다음 명령어로 관련 package를 차례로 install한다. npm i --save @fortawesome/fontawesome-svg-core npm install --save @fortawesome/free-solid-svg-icons npm install --save @fortawesome/react-fontawesome 아이콘을 사용할 파일에서 import해준다. import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { faCoffee, faCheckSquare } from "@fortawesome/free-solid-svg.. 2021. 12. 30. React 개념정리 2021 12월 리액트 공부시작 현재까지의 강의와 공식문서를 바탕으로 기록하려한다. 강의는 nomadcoders의 'ReactJS로 영화 웹 서비스 만들기'를 참고했고 그 외 basics는 공식문서를 참고했다. 앞으로의 목표는 리액트의 기본개념에 좀 더 익숙해져서 인프런에서 구매한 리액트 클론코딩과 리액트관련 책을 한권 읽어보려 한다. 읽으려는 책은 : http://www.yes24.com/Product/Goods/97782392 초보자를 위한 리액트 200제 (React) - YES24 따라하면서 이해하는 React A to Z리액트를 시작하기 전에 개발 환경을 준비하는 과정부터 시작하여 예제 파일을 실행하는 방법을 안내한다. 입문부터 초급, 중급, 활용, 실무까지 5개의 파트로 나 www.yes24... 2021. 12. 13. 이전 1 2 다음