본문 바로가기

React30

2022.05.11 TypeScript 로 React 세팅하기 2022.05.11 TypeScript 로 React 세팅하기_정리노트 ㅎㅇㅎㅇ 드디어 돌아왔다!!!!!! 노마드 코더 강의 듣다가 이리저리 타입스크립트로 바꾸는데 에러가 많이 생겨서..... 흑흑 프로젝트 세팅하는 간단한 포스팅부터 시작해보려구!!(하지만 개인적으로 뻘짓 많이 해버려서 간단하진 않았음.) 나는 이미 만든 프로젝트로 시작하려고 하니 에러 사항이 많던걸....왜 나에게 이런 시련이 흑흑 어쩌다 뭐부터가 잘못된건지 흑흑 일단 처음부터 타입스크립트가 포함된 리액트 프로젝트를 만들려면!! $ npx create-react-app my-app --template typescript $ yarn create react-app my-app --template typescript 요롷게 my-app 부.. 2022. 5. 11.
2021.09.28 React Update,Delete 2021.09.28 React Update,Delete_정리노트 드디어 마지막장...! 완독이 얼마 남지 않았으 마지막까지 빠이링~!~! 포스트 해당 작성자에게 보여줄 수정,삭제 버튼 UI 부터 만들기! 기존에 Button 과 달라서 이번에는 재사용하지 않고 따로 버튼 만들어서 사용할 예정! components/post/PostActionButton.js (새로 생성) import React from 'react'; import styled from 'styled-components'; import palette from '../../lib/styles/palette'; const PostActionButtonBlock = styled.div` display: flex; justify-content: f.. 2021. 9. 29.
2021.09.24 React Post Read 2021.09.24 React Post Detail_정리노트 으으.. 대장정의 끝이 보이는군 오늘은 detail, list 페이지만들기! 오늘도 역시 UI 준비해서 API 연동하는 흐름 ㅇㅇ! 길..겠지..? ㅠ 반복이지만 그래도 하나하나 찬찬히 다시보기 일단 디테일 페이지 UI 부터 components/post/PostViewer.js ( 새로 생성 ) import React from 'react'; import styled from 'styled-components'; import palette from '../../lib/styles/palette'; import Responsive from '../common/Responsive'; const PostViewerBlock = styled(Respo.. 2021. 9. 25.
2021.09.24 React Post Create 2021.09.24 React Post Create_정리노트 다음주까지 완성하기로...스터디원들과 약속했돠..... 그리고...10월달까지 미루지 않고 완독을 해내리라....후 말이 create 지 쉽게 말하면 글쓰기 기능 꼬꼬 바로 빡세게 달려보자!!!! 회원가입, 로그인과 같이 비슷하게 UI 를 구현하고, 리덕스로 상태관리를 하고 마지막으로는 API 연동하기 까지!!! 이번에는 정리하며 주절주절 써보자!!!! 먼저 글쓰기는 Quill 이라는 에디터 라이브러리를 사용해서 구현할거기 때문에 $ yarn add quill 라이브러리 먼저 설치하고 시작! 먼저 라이브러리를 설치했으니까 에디터 UI 부터 만들기! src/components/wirte/Editor.js (새로 생성) import React, {.. 2021. 9. 24.
2021.09.22 React 로그인, 회원가입 (3) 2021.09.22 React 로그인, 회원가입 (3)_정리노트 지금은 새벽 4시 11분에 쓰기 시쟉했균 홀홀 과연 몇시까지 할것인가..... 2일 놀았으니 빡세게 달리는중 .. ㅎ 사실 할머니집에서 쉬고싶다쉬고싶다....ㅋㅋ큐ㅠㅠㅠ 하루 자고 오는데 어쩌다보니 수, 목도 그렇고 팀 플젝 때문에 제대로는 못놀겠지만 그래도 편히 자고 싶어서 끝까지 달리는중 목표 시작 6시....껄껄 하지만 포스팅 기본 4시간 걸려서 장담은 못함 ㅎ 근ㄷ ㅔ 지금 알바 7시간 하고 계속 달리는 ㅈ ㅜ ㅇ 이라... 힘들당 하지만 더이상 미룰수업쯰 ---- 어림도 없지 추석 당일 친척집 방문했다가 자고 바로 일어나서 카페로 달려와서.. 커피 2잔째 홀짝이며.. 포스팅하는 나.... 껄껄 빡세게 다시 달린다!!!!!! 저번에는.. 2021. 9. 22.
2021.09.21 React 로그인, 회원가입(2) 2021.09.21 React 로그인, 회원가입(2)_정리노트 지금 1편 포스팅 쓰고 새벽 1시 6분이군 내일 일찍 일어나야하므로 3시까지 하고 자야지...요즘 빨리 자나 싶더니 유튜브 보다가 맨날 4~5시에 자는.....젠장 그럴 시간에 코드나 칩시다 그리고 추석전에 끝내야..! 할머니집 가서 ...! 편하게 와구와구 할 수 있으니까 좀만 더 짬짬히 빡시게 달리자 ---- 어림도 없지 18일때 저랬는데 지금 21일 벌써 당일임...ㅎ..... 알바 대타도 뛰고 .. 놀기도 놀고....난리였군 다시 채찍질하러 간다. API 를 연동을 드디어 해볼테야. 이제 하나만 하면 된다고 생각하고 얏호했는데 음음 만만치 않아서 gg 하고 2번째 포스팅으로 뺐다^^ ㅋㅋㅋㅋㅋㅋㅋㅋㅋ 뭐보고 쫄았냐면 바로 $ yarn .. 2021. 9. 21.
2021.09.17 React 로그인, 회원가입(1) 2021.09.17 React 로그인, 회원가입(1)_정리노트 아....날ㄹ라가썽.....3시간동안 적은거 다날라갔어....배터리 분명 충전해놨는데....0퍼되서 꺼져서 3시간 날라갔어...너무 참혹하다.......ㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠ 내 맥북이 이제 수명을 다했나봐.... 아 진짜 개 열ㄹ심히적었는데 결론 ... 임시저장을 제발 생활화 합시다 제ㄹ.......ㅂ ㅏ ㄹ..... 오늘은 프로젝트 세팅에 이어서 로그인, 회원가입 UI 를 만들고 리덕스를 이용해 상태관리 , 또 백엔드에 만들어 두었던 API 요청까지라 역대급으로 포스팅일ㄹ 길 것 같다.. 왜냐 UI 만들고 리덕스 하는 도중에 꺼졌는데... 그거 포스팅이 3시간 걸렸거든...껄껄ㄹ 침착하고.... 조금 전보다는 생략되겠지만 최대한 다시 흐름 복.. 2021. 9. 18.
2021.09.16 React 프론트엔드 프로젝트 세팅 2021.09.16 React 프론트엔드 프로젝트 세팅_정리노트 오예 80번째 포스팅이다~!~! 올해 안에 열시미 해서 100개를 목표로.... 방학이 끝나고 1주 2포스팅은 못하겠다만은, 그래도 꾸준히 해봅시다..!가즈아 이제 드디어 리다기에서 마지막 프론트엔드 프로젝트 부분에 들어감! 어우어우 세팅하면서 그동안 배웠던 흐름부터 정리해주시는군 암요.. 따라갑죠 홀홀 뺘샤해보자...!!! 프로젝트 경로는 blog 폴더 안에 blog-backend ( node.js 로 구현해놓음 책따라 한거라서 따로 포스팅은 안할 것임. ) blog-frontend 디렉토리를 만들어서 백엔드와 프론트엔드를 분리했고, 요포스팅에서는 blog-frontend 디렉토리에서 전부 이뤄질것 ㅇㅇ $ yarn create react.. 2021. 9. 16.
2021.08.21 React 서버 사이드 렌더링 2021.08.21 React 서버 사이드 렌더링_ 정리노트 https://korinkorin.tistory.com/70 2021.08.03 리액트 라우터로 SPA 개발하기 2021.08.03 리액트 라우터로 SPA 개발하기_정리노트 드디어....SPA 까지 왔다... 힘들어따...... SPA(Single Page Application) 말 그대로 한 개의 페이지로 이루어진 애플리케이션 기존에는 사용자가 다른 페이 korinkorin.tistory.com 오늘은 여기서 잠시 정리했던 서버사이드렌더링에 대해서 좀 더 심층적으로 알아보고, 리액트 프로젝트에 구현해볼 예정..!! 그때 몰라서 구글링으로 혼자 찾아보고 간단하게 설레발쳐서 정리했었는데 ㅎㅅㅎ .. 책에도 나오는구나 조아써 그 때 잠시 다뤘던 것.. 2021. 8. 21.