목록LINK (2)

PINKYETI

[React] react-router-dom 사용하여 컴포넌트 렌더링하기 (Route/Link Component)

안녕하세요. 오늘은 react-router-dom 라이브러리를 사용하여 React Component를 렌더링 해보겠습니다. 먼저 라우팅을 하기전에 Route 와 Link 컴포넌트의 차이를 간단히 알아보고 넘어가도록 하겠습니다. #1. Link Component - 사용자가 클릭할 수 있는 링크를 생성해주는 컴포넌트 - Link Component 를 클릭하여 지정된 경로로 이동 - 일반적으로 페이지 간 이동을 위한 기능 구현에 사용 됨. #2. Route Component - 특정 경로에 대한 렌더링 규칙을 정의하는데 사용됨. - 사용자가 특정 경로에 접속하였을 때 특정 컴포넌트를 렌더링 - 컴포넌트의 동적 렌더링이 가능하기 때문에, 메인 컨텐츠 관리에 사용 됨. 그럼 두 컴포넌트의 특징을 고려하여, 네비..
# Dev Note/[Frontend] 2024. 1. 24. 22:10
[BootStrap] 부트스트랩 템플릿 활용 및 HTML 연동 (+Navigation Bar)

안녕하세요. 핑크예티입니다. 오늘은 Front-end 를 처음 접하시는 분들께 활용하기 유용한 라이브러리인 "BootStrap" 을 소개하려 합니다. 부트스트랩은 간단히 말씀드리면, Front-end 개발에 유용한 CSS class 및 JavaScript 함수들을 내장해놓은 라이브러리 입니다. 따라서, 이 라이브러리를 HTML에 연동하여 Style을 처음부터 구현하지 않고 import 하여 가져다 쓸 수 있는데요. 어떻게 사용하는지 알아보도록 하겠습니다. 1. BootStrap 다운로드 먼저 부트스트랩을 사용하기 위해서는 다운로드를 받아줍니다. 아래 링크 통해 다운로드를 진행해주세요. (사이트 내에 부트스트랩 Example 도 있으니 참고하세요.) https://getbootstrap.com/ Boots..
# Dev Note/[Frontend] 2022. 4. 20. 23:06
이전 Prev 1 Next 다음