안녕하세요, 오늘은 리액트에서 아이콘을 사용할 수 있는 react-icons에 대해 알아보겠습니다. 구글에 react icons라고 검색하면 가장 첫 번째에 나오는 사이트가 있습니다. https://react-icons.netlify.com/#/ 위 사이트에 들어가면 설치법과 사용방법이 나오는데요, 생성된 리액트 프로젝트 경로 아래 둘 중 하나를 입력하면 react-icons를 사용할 수 있습니다. npm install react-icons --save yarn add react-icons 사용법은 매우 간단합니다. 위 사이트에서는 아래와 같이 다양한 아이콘들을 지원합니다. 이 중, 검색을 통해서 혹은 메뉴를 선택해서 원하는 아이콘을 직접 찾습니다. 예를 들어, 사람 모양의 아이콘을 찾고 싶다면 pers..
안녕하세요, 오늘은 Visual Studio Code(VSC)에서 자주 사용하는 코드를 자동 생성하는 기능을 알아보겠습니다. snippet이란 작은 조각이란 뜻인데 코딩할 때, 단축어처럼 특정키를 입력하면 자동완성해주는 기능을 말합니다. 예를 들어, vsc에서 html이라고 작성하면 아래와 같이 여러 가지 옵션들을 추천해 줍니다. 그중, 2번째 html:5를 선택하면 아래의 사진처럼 html의 기본적인 구조가 자동작성됩니다. 위와 같은 기능을 custom 하게 만드는 법을 알아보겠습니다. 맥 기준으로 아래 그림과 같이 Code - 기본 설정 - User Snippets을 클릭하면 선택하는 창이 뜨게 됩니다. 새로운 것을 생성하려면 New Global Snippets file... 을 클릭해줍니다. sni..
오늘은 react native를 시작해보겠습니다. https://reactnative.dev 위의 react native 공식 홈페이지에서 기본 설치법, 튜토리얼을 확인 할 수 있습니다. 우선 npm(node package management)을 설치해줍니다. 아래 링크를 클릭하여 본인에 맞는 os에 맞게 설치하여줍니다. https://nodejs.org/en/download/ 위 node.js를 설치하였으면 npm을 통해서 원하는 패키지를 다운로드할 수 있습니다. 이제 커맨드 창을 열어 줍니다. $ npm version 위의 명령어를 실행하여 설치가 잘 되었는지 확인해 봅니다. 확인이 됐다면 아래와 같이 React Native를 쉽게 시작해 줄 수 있는 expo를 설치합니다. 몇 분의 시간이 소요될 수..
- Total
- Today
- Yesterday