윤선이와 블로그 만들기_2. 리액트(React) 붙이기

 

오늘은 지난번에 만들어놓은 뼈대에 프론트단을 붙이도록 하겠다.

 

나는 백엔드단 코드(Java)를 작성할때는 IntelliJ를 사용하지만

프론트단 코드는 VS Code를 사용하곤 한다.

 

 

우선 VS 코드에서 터미널을 열어주도록 하자. (Ctrl + `)

그리고 폴더를 하나 만들어서, 해당 폴더 안에 리액트 프로젝트를 생성해보자.

 

 

1. mkdir 폴더명

- 폴더를 생성한다. 나 같은 경우에는 front 라는 이름으로

 

2. cd front

- cd는 Change Directory이다. front 폴더로 이동한다.

 

3. npx create-react-app 경로

아래를 참고하셈

https://ko.reactjs.org/docs/create-a-new-react-app.html

새로운 React 앱 만들기 – React

 

그러면...뭐라 샬라샬라 올라오다가

 

대충 석세스했다는 뜻

이렇게 성공했다는 메시지와 함께 해피해킹 하라고 한다.

 

왜 Happy Hacking인가?

 

라는 대화를 바로 어제 윤선이와 나눠서 본김에 찾아보았다.

 

그래서 검색해보니까 아래와 같은 글이 레딧에 있었다.

아~ ㅋㅋ

아~ㅋㅋ

...

 

create-react-app을 했을 때 Happy Hacking이 나오는 동기가 무엇일까?

 

답변자(acemarke)에 의하면 'Hack' 이란 단어가 '영리한 문제해결'이란 뜻을 가지고 있다는 듯?

실제로 네이버에도 이런 뜻으로 나오는 사전이 있다.

해크

그렇다고 한다.

 

그럼 이제 프론트단 코드가 정상적으로 만들어졌는지 확인해보자.

 

터미널에 yarn start 를 입력하여, 기본으로 세팅되어있는 리액트 개발환경을 띄워보자.

 

 

아래와 같이 이런 메시지가 올라왔다면, 브라우저에서 'localhost:3000' 으로 접속해보자.

 

 

그랬더니 리액트 로고가 이렇게 빙글빙글 돌아간다면, 성공한거다.

 

야 쉽다 쉬워