728x90 반응형 Coding With Jina/React19 [React] 리액트에서 아이콘 사용하기 / 리액트에서 Font Awesome 사용하기 자바스크립트에서처럼 설치없이 링크만으로 import 해서 사용하는 방법은 없는 것 같다.. 1. 일단 터미널에서 아래 코드입력해서 설치하고 npm install react-icons --save https://react-icons.github.io/react-icons React Icons React Icons Include popular icons in your React projects easily with react-icons, which utilizes ES6 imports that allows you to include only the icons that your project is using. Installation (for standard modern project) npm install r.. 2022. 11. 14. [React] 리액트 Hooks - useEffect( ) 함수 1) useEffect( ) 함수란? - React component가 렌더링 될 때마다 특정 작업(Sied effect)을 실행할 수 있도록 하는 리액트 Hook - 렌더링 혹은 변수의 값 혹은 오브젝트가 달라지게 되면 그것을 인지하고 업데이트를 해주는 함수 - 콜백 함수를 부르게 되며 렌더링 혹은 값, 오브젝트의 변경에 따라 어떠한 함수 혹은 여러 개의 함수들을 동작 - useEffect는 component가 mount 됐을 때, component가 unmount 됐을 때, component가 update 됐을 때 특정 작업을 처리 - 클래스형 컴포넌트에서 사용할 수 있었던 생명주기 메소드를 함수형 컴포넌트에서도 사용할 수 있게 된 것 2) useEffect( ) 사용법 ※ 기본 형태 useEffec.. 2022. 11. 11. [React] 다운로드 없이 구글 폰트 적용하기 1. 구글폰트 사이트에서 적용하고 싶은 폰트를 담는다. 2. @import를 선택하고 @import url('주소');를 복사( 태그는 제외) 3. 리액트 CSS파일에 넣기 4. import 복사했던 아래에 있는 코드를 복사 5. css 파일에서 적용해주고자하는 곳에 가서 복붙! 2022. 11. 6. [React] 리액트 첫 시작할때 알아야 할 기본 지식(업데이트중) 1. html과 같은 마크업은 html 파일에서 하는 것이 아니라 App.js 파일 안에서 function App(){ return( 여기안에 작성한다. ) } 2. 모든 html은 return( ) 안에 작성되는데 한개의 div로 묶여야한다. function App(){ return( 안녕하세요. ) } 2022. 11. 3. [React] 리액트에서 emmet 쓰는 법 / 리액트 단축키 적용하기 vs code에서 html 작업할때 사용했던 div.클래스명, div#클래스명 이런 emmet을 리액트에서는 사용이 안됨 -> 따로 설정해줘야함! 1. 파일 -> 기본 설정 -> 설정 클릭 *단축키 - Window : Ctrl + , - Mac : Command + , 2. 작업영역 탭 -> emmet -> setting.json 클릭 3. 열린 setting.json 파일에 아래 다음 줄을 추가 "emmet.includeLanguages": { "javascript": "javascriptreact" } * 핑크 대괄호 안에다 복붙하고 다른 코드가 있을 경우 콤마(,) 찍어주기! 4. 결과 짜잔~ [참고] https://eshwaren.medium.com/enable-emmet-support-for-j.. 2022. 10. 28. [React] 리액트 시작하기 - 새로운 프로젝트 생성 방법 리액트 설치 방법은 여기로! https://coding-with-jina.tistory.com/94 [React] 리액트 초기 세팅 - ① Node.js 사이트에서 npm 다운로드 및 설치하기(Windows 10) 리액트를 시작하기 위해서는 리액트 툴을 추가해야한다. 여기서 3가지 방법이 있는데 우리는 Create React App을 이용한 리액트 활용법을 알아볼 것이다. 리액트 시작 전 초기 세팅 1) Node.js 사이트에 coding-with-jina.tistory.com 1. 일단 Node.js와 VS code 에디터 설치 구글에 Nodejs 검색해서 15버전 이상을 설치 (17.0버전은 금지) 예전에 Nodejs 15미만버전 설치했어도 지우고 재설치하기 설치할 때 설치폴더 C드라이브로 잡힌거 그.. 2022. 10. 7. 이전 1 2 3 4 다음 728x90 반응형
