본문 바로가기

FE/React3

[React] react 프로젝트 생성하기 (for MacOS) 이직 준비를 하면서 사이드 프로젝트를 시작할 때, 과감하게 프론트엔드를 React 로 시작했습니다.처음 해보는 React 라 인강의 도움도 받고, 많은 블로그 포스팅들의 도움을 받아 꾸역꾸역 했던 기억이 있네요. 프로젝트라는게 한 번 만들면, 새로운 프로젝트를 만들기 전 까지는 다시 해 볼 일이 별로 없어서(아예 없기도 하죠?) 할 때 마다 까먹곤 합니다. (사실 저도 지금 하려니까 까먹어서 이참에 글로 남겨놓고 기억 안날 때 마다 제가 쓴 글 보면서 세팅하려고 합니다 ㅎㅎ.) 그래서 써놓고 써먹을라고 기록하는 포스팅이니 저 처럼 React 를 시작하는 분이나 조금 했었는데 까먹었다 하시는 분들에게 조금이나마 도움이 됐으면 좋겠네요.프로젝트 세팅 과정을 기록하는 포스팅입니다. 툴은 VS Code 를 사용.. 2024. 4. 25.
[React-Quill] 웹 에디터 적용기 사이드 프로젝트를 진행하면서 웹 에디터를 구현할 사항이 발생했습니다. 제 사이드 프로젝트의 Front 는 React 기반으로 되어있기에, React 에서 사용할 수 있는 웹 에디터를 찾던 중 react-quill 이라는 라이브러리를 알게되어 적용하게된 사항을 기록해보려 합니다. 1. react-quill 설치 전 VSCode 를 사용하면서 React 를 개발하고 있어, VSCode 내 터미널에서 아래 명령을 실행하여 react-quill 라이브러리를 설치했습니다. npm install react-quill --save 위 명령어를 실행하면, 아래와 같이 react-quill 의존성이 추가됩니다. ``` package.json { "name": "react-shoppingmall-partners", "ve.. 2024. 1. 2.
[React] 리액트 사용 시, 쓸만한 패키지 모음(1) 사이드 프로젝트를 개발하면서 FrontEnd 에 React 를 적용해보고 있는데, 편한 라이브러리들이 많아 몇 가지 정리해본 포스팅입니다. 1. styled-component 설치방법 #npm npm install styled-components #yarn yarn add styled-components 공식사이트 https://styled-components.com/ styled-components CSS for the Age styled-components.com 가장 먼저 styled-component 입니다. styled-component 를 사용하면 아래처럼 css 가 적용된 tag 를 커스텀해서 사용할 수 있습니다. const StyledWrapper = styled.div` margin:0 .. 2023. 6. 23.