본문 바로가기

Dev/react16

React 로 포트폴리오 페이지 만들기 / 3일만에 만든 포폴의 퀄은,,? / slick-carousel 사용법 3월의 시작과 동시에 역대급 바쁜 하루하루를 보냇따,, 갑자기 잡힌 포지션 제안 면접부터 프로그래머스 dev-matching 프론트엔드 챌린지까지... 일단 가장 먼저 해야겠다 생각했던건 포트폴리오 페이지라서, 후다닥 만들어보기로 했다! 나으 개발 멘토님께 여쭤보니, 템플릿을 사용하는 경우도 많다고 해서 유료로 리액트 템플릿을 판매하는 페이지도 여럿 구경했는데, 일단은 마음이 급해서 그 템플릿 뜯어보고 분석하고 있는 시간보다 퀄은 떨어지더라도 CSS 까지 다 내가 해보자! 해서 바로 시작! 항상 그랬듯 CRA 로 프로젝트를 만들었고, 핀터레스트에서 Responsive web design 이나, web frontend portfolio 로 검색해서 아이디어를 얻었다! 대충 어떤 레이아웃으로, 어떤 내용을 .. 2022. 3. 14.
firebase 사용기와 resizing extension 실패기 / build 후 api key 보안 이슈까지! 리액트를 다루는 기술 책을 다 공부하고 책 기반으로 개인 프로젝트를 진행했었는데, 백엔드와 프론트를 모두 구축하는 책 기반 방법이 무한 스크롤을 구현하며 제대로 막혀버려서,, 환기용으로 다시 노마드코더의 트위터 클론 코딩 강의를 들었었다! 그 강의에서 구글의 firebase 를 이용했는데, 개인적으로 굉장히 신세계라고 느껴서 개인 프로젝트도 다 엎고 파베 기반으로 다시 진행했당 그 과정에서 조금씩 메모했던 부분과, 리사이징 익스텐션을 내 프로젝트에는 왜 사용할 수 없었는지에 대한 복기도 함께 해보려고 한당~ 일단 내가 파이어베이스가 신세계라고 느꼈던 이유 중 하나는 인증부분이었다! 기본적으로 구글 로그인, 깃헙 로그인을 제공해주고 사용하는 방법도 정말 쉬워서, 내 프로젝트에도 파베를 써야겠다고 생각했던 .. 2022. 3. 6.
리액트를 다루는 기술을 끝내며 / 내가 까먹을까봐 정리하는 react-router-dom@6 버전 수정사항 e-bok 으로 공부하고있던 "리액트를 다루는 기술" 책을 드디어 끝냈다! 중간중간 고난과 역경이 있었지만..(서버사이드렌더링이라던가 SSR 이라던가.....) 어찌저찌 완독! 아이패드 메모로 체크해놨던 버전에러같은 오류를 책 끝난 기념으로 블로그에 정리하러 왔당. https://digital.kyobobook.co.kr/digital/ebook/ebookDetail.ink?selectedLargeCategory=001&barcode=4801160508797&orderClick=LEa&Kc= 리액트를 다루는 기술 본문과 소스 전면 업그레이드! 기본기를 꼼꼼하게! 실전에서 효과적으로 활용하는 방법까지 알차게 배우자! 본문과 소스 전면 업그레이드! 기본기를 꼼꼼하게! 실전에서 효과적으로 활용하는 digita.. 2022. 1. 28.
이 주길놈의 에러 - Using `babel-preset-react-app` requires that you specify `NODE_ENV` or `BABEL_ENV` environment variables. 지금 나는 노마드코더의 리액트 강의를 다 듣고 '리액트를 다루는 기술' 책을 열심히 공부하고 있다! 중간중간 버전 에러도 다 메모해가며 나름 뿌듯할 정도로 공부하고 있는데, 오늘은 번번히 내 발목을 붙잡는,,^^ 자주 만나서 반가울 정도의 에러 해결법을 메모하고자 급하게 블로그를 켰다! (빨리 챕터20 끝내고 자고싶은 이 와중에,,,) 내가 만난 에러는 바로 이것! 항상 yarn eject 만 해주면 이 꼴이 나면서 모든 파일의 import 에 빨간 줄이 죽죽 그어진다,,,후 여기저기 구글링했지만 그닥 소득이 없어서, (package.json 파일의 script 부분 수정하는 방법, start 명령어 작성할 때 NODE_ENV = development 쓰기,,,등) 에러 메세지를 그대로 읽고 수정해보기로.. 2022. 1. 20.