No image

Dev/Frontend

[React] React.js 튜토리얼 2- 주요 개념 살펴보기(JSX, Component, Props, State)

이전 포스팅을 보려면 아래 링크를 눌러주세요. [React] React.js 튜토리얼 1- 프로젝트 생성 및 실행하기 간단한 React 예제 프로젝트를 만들어보기 앞서, 알아둬야하는 React의 개념과 특징들을 살펴봅시다. . React로 구현된 애플리케이션은 일반적으로 하나의 루트 DOM 노드가 있습니다. 이 안에 들어가는 모든 엘리먼트를 React DOM에서 관리합니다. 엘리먼트를 렌더링하기 위해서는 ReactDOM.createRoot()에 엘리먼트를 전달한 다음, root.render()에 전달해야 합니다. 튜토리얼1에서 만들어보았던 프로젝트의 index.js를 열어보면 다음과 같이 작성되어 있습니다. root.render에 App.js에 만들어놓은 App 엘리먼트가 전달된 것을 알 수 있습니다. ..

by DOMDOMI 2023. 12. 9.

No image

Dev/Java

[java] spring boot maven: mongoDB 연동하기

1. pom.xml dependencies에 몽고DB를 추가해줍니다. org.springframework.boot spring-boot-starter-data-mongodb 2. application.properties에 몽고DB 접속정보를 작성합니다. spring.data.mongodb.host=localhost spring.data.mongodb.port=27017 spring.data.mongodb.authentication-database=admin spring.data.mongodb.database=database spring.data.mongodb.username=name spring.data.mongodb.password=password 3. 몽고DB 연동 config.java파일을 하나 만..

by DOMDOMI 2023. 6. 28.

No image

Dev/Frontend

[icon] Line Awesome icon 사용하는 방법

html에서 line awesome icon을 사용하는 방법입니다~ 아래는 line awsome 사이트에요. https://icons8.com/line-awesome Line Awesome — Free Beautiful Icon Font Swap Font Awesome for modern line icons in one line of code. icons8.com 메인 페이지에서 Getting Started 버튼을 누르면 사용하는 방법을 알 수 있답니다. Getting Started를 눌러서 보면 html에서 cdn을 로드해서 사용할 수 있도록 링크가 달아져있어요! 요 cdn link들을 복사해서 html에 붙여넣어주세요! 이제 line awesome 사이트에서 먼저 어떤 아이콘들이 있는지 확인해보아요...

by DOMDOMI 2021. 10. 13.