Jieunny의 블로그

📣 TodoList 만들기 𝟭. 사용 스택(라이브러리 등) - React ㄴ react-spinners(로딩 화면) ㄴ react-icons ㄴ react-router-dom - Redux (메모 목록 관리) - Json-server (할일 목록 관리) - Styled-components - Framer-motion (페이지 이동 효과) - Moment (달력) 𝟮. 구현 기능 - todo CRUD - todo 초기화 - 달력에서 완료 todo 확인 기능 ㄴ 완료한 일정이 있는 날은 빨간 점으로 표시 - memo CRUD - 회원가입, 로그인, 로그아웃 기능 ㄴ json-server 이용 - 글꼴 변화 기능 ㄴ 초기화 시 처음 글꼴로 돌아오는 에러? 존재 - 데이터 받아오기 전까지 로딩화면 구현 - Me..

📌 문제자신이 감옥에 간 사이 연인이었던 줄리아를 앤디에게 빼앗겨 화가 난 조지는 브레드, 맷과 함께 앤디 소유의 카지노 지하에 있는 금고를 털기로 합니다. 온갖 트랩을 뚫고 드디어 금고에 진입한 조지와 일행들. 조지는 이와중에 감옥에서 틈틈이 공부한 알고리즘을 이용해 target 금액을 훔칠 수 있는 방법의 경우의 수를 계산하기 시작합니다. 예를 들어 $50 을 훔칠 때 $10, $20, $50 이 있다면 다음과 같이 4 가지 방법으로 $50을 훔칠 수 있습니다.$50 한 장을 훔친다$20 두 장, $10 한 장을 훔친다$20 한 장, $10 세 장을 훔친다$10 다섯 장을 훔친다훔치고 싶은 target 금액과 금고에 있는 돈의 종류 type 을 입력받아, 조지가 target 을 훔칠 수 있는 방법의 ..

📣 React Custom Hook 을 사용해서 블로그 화면 구현해보기 𝟭. 구현 조건 1️⃣ Bare Minimum App 루트 컴포넌트(App.js) react.lazy()와 suspense를 사용하여 컴포넌트를 리팩토링합니다. BlogDetail 컴포넌트(BlogDetail.js) 현재는 개별 블로그 내용으로 진입해도 내용이 보이지 않습니다. useParams()을 이용하여 개별 id를 받아와 개별 블로그의 내용이 보일 수 있도록 해봅니다. delete 버튼을 누르면 다시 home으로 리다이렉트 되어야 합니다. useNavigate()를 이용하여 handleDeleteClick 함수의 로직을 작성해주세요. 하트를 누르면 home에서 새로고침을 했을 때 숫자가 올라가야 합니다. isLike와 blog..

📣 나만의 아고라스테이츠(리액트 리팩토링) 웹앱 번들링 후 배포하기 📚 참고 : https://velog.io/@seul_/%EB%A6%AC%EC%95%A1%ED%8A%B8-%EC%9B%B9%EC%95%B1-%EB%B2%88%EB%93%A4%EB%A7%81-%ED%9B%84-%EB%B0%B0%ED%8F%AC%EC%9B%B9%ED%8C%A9%EC%9C%BC%EB%A1%9C-CRA%EC%97%86%EC%9D%B4-%EB%A6%AC%EC%95%A1%ED%8A%B8-%EA%B0%9C%EB%B0%9C%ED%99%98%EA%B2%BD-%EA%B5%AC%EC%B6%95 🚨 냅다 따라하다가 뭐 잘못만졌는지 리액드 앱 자체가 안켜져서 새 플젝 만들었다.. 서버랑 연결 어떻게 하는건데.. 𝟭. 개발환경 초기화 npm i ..

📣 나만의 아고라스테이츠 번들링 하기 📚 참고 : https://velog.io/@seul_/%EA%B0%84%EB%8B%A8%ED%95%9C-%EC%9B%B9%EC%95%B1-%EB%B2%88%EB%93%A4%EB%A7%81-%ED%9B%84-%EB%B0%B0%ED%8F%AC%EC%9B%B9%ED%8C%A9-%EA%B8%B0%EC%B4%88-%ED%8A%9C%ED%86%A0%EB%A6%AC%EC%96%BC 서버는 어떻게 연결하지.. 얘는 서버 안켜도 데이터가 그대로 뜨는데 왜 React로 한건 안되는거지..!! 𝟭. 현재 디렉토리에 npm 설치하기 npm init -y ➰ package.json 파일 생성 𝟮. 웹팩 설치하기 npm install -D webpack webpack-cli 𝟯. Webp..

📣 반응형 웹 구현하기✔️ 클론 페이지 : http://www.csszengarden.com/CSS Zen Garden: The Beauty of CSS DesignSo What is This About? There is a continuing need to show the power of CSS. The Zen Garden aims to excite, inspire, and encourage participation. To begin, view some of the existing designs in the list. Clicking on any one will load the style sheet into thiwww.csszengarden.com➰ 페어분이 미리 찾아주셔서 클론하기로 했당 ➰ 큰 화..