끄적끄적 메모장

React 개발환경을 구축하게 되면 public, src라는 디렉터리가 생성됩니다. public 디렉터리 : 웹에서 보여지는 화면인 index.html이 있는 디렉터리이다. ※

구현한 소스를 React 빌드할때는 npm run build를 타이핑 하게 되면 build 라는 디렉터리가 생성됩니다. 테스트를 할때는 샘플 웹에서 구현을 하지만 실제 서비스를 할때는 빌드를 하여 용량이 보다 더 작은 build 디렉터리를 활용한다. npm install -g serve : 이 컴퓨터 어디에서도 serve라는 명령어를 통해서 웹서버를 설치할 수 있다. npm serve -s build : serve라는 웹서버를 다운로드 받아서 실행시킬때 빌드 디렉터리를 다큐먼트 루트로 하겠다. Local, Network 2가지의 주소로 들어가게 되면 현저히 적어진 용량의 웹페이지를 볼 수 있습니다.

React를 구현하기 위해서 구현되어 보여질 화면이 필요합니다. 화면을 보기 위해 샘플 웹/앱을 실행합니다. 실행하는 방법은 아래와 같습니다. 각자의 개발자 도구에 들어가서 Terminal 에서 npm run start 를 타이핑 하여 실행 ※ 작업중이던 웹을 끌때는 Ctrl + C를 눌러 실행을 끕니다. 타이핑을 치게 되면 아래와 같은 웹이 뜨고 소스를 수정하며 화면을 구현해 가면 됩니다.

React를 시작하기 앞서 먼저 설치해야 하는 프로그램들이 있습니다. 1. 먼저 React 공식 홈페이지에 들어가 Get Started버튼을 클릭한다. https://reactjs.org/ 2. Create a New React App에 있는 Learn how를 클릭해줍니다. Online Playgrounds - 온라인 상에서 React 애플리케이션을 구현해볼 수 있는 사이트 들이다. Add React to a Website - 이미 웹 사이트를 가지고 있는 상황에서 처음부터 끝까지 React 앱을 만드는게 아니라 부분적으로 React 기능을 추가하고 싶을 때 사용한다. 처음에는 시작하기 쉬울수 있지만 뒤로 갈수록 개발 환경을 직접 구축해야하는 어려움들이 많기 때문에 초급자들에게 사용이 어렵다. Crea..

프론트엔드란 무엇인가? 프론트엔드 개발자는 웹서비스를 하면서 사용자와 서비스를 연결해주는 과정의 모든 것들을 구현하는 역활을 한다. ※ 웹 서비스 : 사용자가 어떠한 입력을 하고 입력을 통해 더 가치있는 데이터를 만들어 사용자에게 잘 전달해주는 것 1. 디자인된 UI를 보여주기 - 홈페이지 내 들어가는 데이터들이 적절히 HTML과 CSS를 활용하여 요구하는 디자인의 형태로 나타내는 역활을 합니다. 2. 화면을 보여주는 기능 - 이미 만들어진 데이터에서 사용자의 입력을 받아서 적절하게 다른 화면으로 변경해 주는 역활을 합니다. - JavaScript, typeScript, React 등 활용하여 보여주기도 하며 대부분의 UI와 DOM,API에 대한 이해와 View를 이루고 있는 데이터에 대한 깊은 이해가 ..

React는 사용자 인터페이스를 구축하기 위한 선언적이고 효율적이며 유연한 JavaScript 라이브러리입니다. "컴포넌트"라고 불리는 작고 고립된 코드의 파편을 이용하여 복잡한 UI를 구성하도록 돕습니다. React의 장점 1. 자바스크립트 문법을 그대로 사용한다. 2. 오픈소스 프로젝트이면서 지속적인 관리가 이루어지고 있으며 많은 사용자 수를 기반으로 생태게가 활성화되어 있다. 3. 컴포넌트를 비교적 더 단순하고 간단하게 정의할 수 있고 웹이 아닌 플랫폼에서도 활용할 수 있는 기술로 확장되어있다. 4. 배우기가 간단하며, 애플리케이션을 만들 때 복잡함이 다소 적다. 5. 간편한 UI 수정과 재사용이 용이하다.