728x90 반응형 Coding With Jina154 [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. [CSS] 태그 기본 스타일 초기화 - all속성 unset ● all 속성 - all: unset; - 태그의 기본 스타일 값을 초기화 시켜주는 속성 button{ all: unset; } 이렇게 기본 버튼 모양이 초기화되어, 텍스트만 남게된다. 따로따로 초기화 시켜주려면 ↓↓↓↓↓ ● textarea textarea{ /*기본스타일초기화*/ resize: none; border: none; overflow:hidden; } textarea:focus { outline: none; } ● ● ● ● ● 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. [CSS] [퍼온글] flexbox로 만들 수 있는 10가지 레이아웃 flexbox를 활용한 10가지 레이아웃 사례 이 글에서는 실무에서 많이 사용하는 다음 10가지 레이아웃을 flexbox로 구현하는 방법을 소개한다. 이 레이아웃은 기존의 display 속성이나 float 속성, position 속성 등으로는 구현이 어렵거나 구현이 불가능하다. 하지만 flexbox를 사용하면 쉽게 구현할 수 있다. 레이아웃 1 - 스크롤 없는 100% 레이아웃 레이아웃 2 - 내비게이션 영역 레이아웃 3 - 브라우저 화면 아래에 붙는 푸터 레이아웃 4 - 정렬이 다른 메뉴 레이아웃 5 - 폼 레이블 수직 중앙 정렬 레이아웃 6 - 중앙 정렬 아이콘 레이아웃 7 - 유동 너비 박스 레이아웃 8 - 말줄임과 아이콘 레이아웃 9 - 위아래로 흐르는 목록 레이아웃 10 - 가로세로 비율을 유지.. 2022. 10. 21. 이전 1 ··· 5 6 7 8 9 10 11 ··· 26 다음 728x90 반응형
