반응형 분류 전체보기86 [REACT] 컴포넌트에 props 전달하기 - 공식 문서랑 같이 공부하기 시리즈3 -목차- [0] 서론 [1] 컴포넌트에 props 전달하는 방법 & 컴포넌트에서 props 읽는 방법 [2] props에 디폴트값 주는 방법 [3] JSX 전개 구문으로 props 전달하기 [4] 자식을 JSX로 전달하기 [4] props가 변하려면..? 서론 props는 JSX 태그에 전달하는 정보다. 예를 들어 img 태그에는 className, src, alt, width, height가 담길 수 있다. 이 속성들은 img 태그에 미리 정의되어 있는 props 이다. 하지만 컴포넌트에는 props에 무엇이든! 전달할 수 있다. 컴포넌트에 props 전달하는 방법 & 컴포넌트에서 props 읽는 방법 1. 자식 컴포넌트에 props 전달하기 export default function Profile().. 2023. 11. 14. [REACT] Components Import & Export - 공식 문서랑 같이 공부하기 시리즈2 -목차- [1] ROOT Component란? [2] 컴포넌트 Export & Import 하기 [3] 같은 파일에서 컴포넌트 여러 개를 Export & Import 하기 Root Component란 개인 환경마다 다르겠지만, 보통 Root Component는 App.js 파일이다. create-react-app으로 실행할 경우 앱이 실행되는 지점은 App.js라고 보면 된다. 만약에 Next.js처럼 파일 기반으로 라우팅하는 경우라면 페이지별로 root 컴포넌트가 다를 수 있다. (Next.js를 안 써봐서 정확하게 와닿지는 않는다.) function Profile() { return ( ); } export default function Gallery() { return ( Amazing scient.. 2023. 11. 14. [REACT] Components - 공식 문서랑 같이 공부하기 시리즈1 컴포넌트 컴포넌트는 리액트의 핵심 개념 중 하나이다. HTML에서는 markup이 웹의 UI를 구성한다. 리액트는 markup과 css, javascript를 컴포넌트로 결합하여 '재사용가능'한 UI 요소를 만든다고 생각하면 된다. (markup은 , 과 같은 것을 이야기한다.) 컴포넌트를 구성하는 방법 export default function Profile() { return ( ) } 1. 컴포넌트를 Export 한다. (내보내기) - 이 부분으로 인해 다른 파일에서 내보낸 function을 import할 수 있게 해주는 것이다. 2. function을 정의한다. - function Profile() { } 이 부분에서 Profile이라는 이름을 정해준다. 이때 이름을 대문자로 쓰지 않으면 작동하지.. 2023. 11. 14. [Python, MongoDB] 중복 문서 제외하고 Insert 하는 방법 Python에서 중복 문서 제외하고 Insert 하는 방법 - 문서를 한 번에 삽입 python에서 MongoDB를 사용할 때 문서를 한 번에 삽입하는 코드는 아래와 같다. 이때 반드시 pip instal pymongo 를 통해 pymongo 라이브러리가 설치되어 있어야 한다. from pymongo import MongoClient # MongoDB에 연결 client = MongoClient('mongodb://localhost:27017') # 데이터베이스 선택 db = client.mydb # 컬렉션 선택 collection = db.mycollection # 삽입할 문서들 documents = [ {"name": "Alice", "age": 25}, {"name": "Bob", "age": 30.. 2023. 7. 14. 이전 1 2 3 4 5 6 ··· 22 다음 728x90 반응형
