본문 바로가기
SSAFY

리액트 시작하기!

by 주식하는 개발자 하워드 2023. 7. 24.

안녕하세요~~!

SSAFYcial 주영인입니다!

 

오늘의 기사는

리액트(React) 시작하기!

입니다!

 

먼저 React란?

 

리액트는 자바스크립트 라이브러리의 하나로서 사용자 인터페이스를 만들기 위해 사용된다.

 

페이스북과 개별 개발자 및 기업들 공동체에 의해 유지보수된다.

리액트는 싱글 페이지 애플리케이션이나 모바일 애플리케이션 개발에 사용될 수 있다.

(출처: 위키백과)

 

2학기 프로젝트에

프론트엔드 개발을 담당하면서

팀 회의를 통해

React를 사용하기로 정해졌습니다!

 

React는 한국에서 가장 많이 쓰이는

웹개발 프레임워크이기도 하는데요

 

프론트엔드 개발자

채용공고를 보면

React.js 사용경험보유가

공고란에 있을 정도입니다!

 

먼저 React를 실행하려면 무엇을 해야할까요?

 

1. Node.js를 설치해야 합니다.

 

https://nodejs.org/en/

 

Node.js

Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.

nodejs.org

node.js란?

V8으로 빌드된 이벤트 기반 자바스크립트 런타임이다. 웹 서버와 같이 확장성 있는 네트워크 프로그램 제작을 위해 고안되었다. 출처(위키백과)

 

웹 서버 - 위키백과, 우리 모두의 백과사전

위키백과, 우리 모두의 백과사전. 세계 최초의 웹 서버 웹 서버(Web server)는 다음의 두 가지 뜻 가운데 하나이다. 웹 서버: 웹 브라우저와 같은 클라이언트로부터 HTTP 요청을 받아들이고, HTML 문서

ko.wikipedia.org

 

JavaScript 라이브러리이기 때문에

Node.js를 설치하여 실행합니다!

연습용이면

어떤 버전이든 상관없습니다.

 

그리고 노드의 버전을 확인하기 위해서

명령프롬프트나 git bash를 열어

node의 버전과

 

npm의 버전을 확인합니다.

 

명령창이나 터미널을 열어

npm install -g create-react-app

npm install -g create-react-app

명령어를 실행하면

create-react-app이 설치됩니다!

이렇게 React를 실행할 수 있는 환경이 완성되었습니다!

 

 

그리고 리액트를 실행하는 방법을 알아보겠습니다.

 

 

npx create-react-app app이름

저 같은 경우

예시를 보여주기 위해

app이름을 my-react-app으로 했습니다.

 

 

 

npm start라는 명령어를

입력하면

 

Localhost로 연결되면서

React 로고가 회전하시는 것을 볼 수 있습니다!

 

아래의

Learn React 링크를 클릭하면

 

 

리액트를 학습하기 위한 공식문서로 넘어갑니다!

많은 참고 하셔서 공부하시기를 바랍니다!

https://react.dev/learn

 

Quick Start – React

The library for web and native user interfaces

react.dev

 

 

 

 

 

 

 

 

사진을 누르시면 SSAFY 홈페이지로 이동합니다!

댓글