안녕하세요 러닝클루 입니다. 항상 러닝클루를 찾아주셔서 대단히 감사드립니다.
오늘은 #IT #개발자들에게 뜨거운 관심을 가지고 있는 #React교육!
#React 관련 교육에 대해 알아보려고 합니다.
React란 무엇일까요?
#리액트(React)는 React.js 또는 ReactJS 라고도 불리며 자바스크립트 라이브러리의 하나로서
#사용자의 인터페이스(UI) 만들기 위해 사용됩니다.
특히 리액트는 페이스북 #조던워크(Jordon Walke)가 개발을 시작해
지금은 페이스북과 인스타그램의 개발자들이 유지, 보수를 담당하는 오픈소스로 유명해졌습니다.
그럼 리액트의 특징을 한번 살펴볼까요?
어리지만 강한 #React
#프레임워크로서는 어찌보면 부족한 프레임워크 일 수도 있습니다.
프레임 워크라면 흔히 MVC라고 하는 Model, View, Controller를
기본적으로 다루어야 하지만 리엑트는 View에만 초점을 맞추고 있습니다.
이것이 오히려 매력적으로 다가오고 있는점이죠.
최근 개발언어가 자바스크립트 ES6이상으로 호환성이 확장이 되어
범용성에 더불어 다른 언어처럼 무거운 프로그래밍에도 사용이 가능합니다.
특히 템플릿 문법이 JSX(JavaScript XML)으로 XML에 익숙한 사람들에게 쉽게 받아들일 수 있고
자바스크립트의 가독성을 높이는것이 큰 장점입니다.
쉽고 편한 React
흔히 React를 이야기 할 때 항상 비교하는 프레임 워크가 바로 '#Angular.js' 입니다.
#JSX의 문법사용부터, React의 구조 특성상 심플한 점이 익히기에 쉽고 사용하기 편리합니다.
자바스크립트를 경험한 분들이라면 더욱 쉽게 느껴질겁니다.
또한 데이터 변경이 일어나면 일일이 자바스크립트 변수 값을 수정하여 DOM에 적용시켜 주어야 했는데,
React는 값 변경하면 자동으로 DOM 업데이트까지 해주어 편리합니다.
특히 개발 특성상 데이터 변경이 지속적으로 일어나는 환경이라면 더욱 유용한 프레임 워크입니다.
React의 핵심 #Virtual DOM
React의 핵심 기능이기도 한 Virtual DOM은 데이터를 dom으로 출력할때 바로 표시하는 것이 아니라
가상의 DOM을 생성하고, 여기에 한번 그린 후 기존 DOM과 비교하며
"다른" 부분만 새로 그리는 작업을 수행합니다.
모든 View를 다시 그리지 않고 변경된 부분만 수정하여 화면에 출력하기 때문에 성능에 큰 이점이 있습니다.
러닝클루만의 특별한 과정
"React를 활용한 웹 서비스 개발과정"
새로운 자바 스크립트 라이브러리에 대한 두려움이 있으신가요?
아직도 HTML으로만 웹 개발을 해오셨나요?
이제 러닝클루와 함께 쉽고 빠르게 웹 서비스를 개발해보세요!
과정은 단계별로 Basic과 Advance로 구분됩니다.
1. React를 활용한 웹서비스 개발 Basic
- React 개발에 필요한 환경을 구축 합니다.
- 새로운 자바스크립트 문법을 학습 합니다. ES2015(ES6), ES7, ES8
- 개발 편의를 위한 VSCode IDE를 학습 합니다.
- 기본적인 Git 사용법을 학습 합니다.
- PR 코드 리뷰를 응용한 개발 프로세스를 학습 합니다.
- React 로 간단한 노트 앱 제작합니다.
2. React를 활용한 웹서비스 개발 Advance
- React 를 응용해 컴포넌트를 넘어서 나만의 애플리케이션을 제작합니다.
- 트위터를 클론해보면서 애플리케이션 설계 원리를 이해합니다.
- 라우터의 개념과 상태 관리 라이브러리 Redux 를 학습합니다.
자세한 문의 사항은 아래 문의하기를 통해 연락 주시길 바랍니다.
안녕하세요 러닝클루 입니다. 항상 러닝클루를 찾아주셔서 대단히 감사드립니다.
오늘은 #IT #개발자들에게 뜨거운 관심을 가지고 있는 #React교육!
#React 관련 교육에 대해 알아보려고 합니다.
React란 무엇일까요?
#리액트(React)는 React.js 또는 ReactJS 라고도 불리며 자바스크립트 라이브러리의 하나로서
#사용자의 인터페이스(UI) 만들기 위해 사용됩니다.
특히 리액트는 페이스북 #조던워크(Jordon Walke)가 개발을 시작해
지금은 페이스북과 인스타그램의 개발자들이 유지, 보수를 담당하는 오픈소스로 유명해졌습니다.
그럼 리액트의 특징을 한번 살펴볼까요?
어리지만 강한 #React
#프레임워크로서는 어찌보면 부족한 프레임워크 일 수도 있습니다.
프레임 워크라면 흔히 MVC라고 하는 Model, View, Controller를
기본적으로 다루어야 하지만 리엑트는 View에만 초점을 맞추고 있습니다.
이것이 오히려 매력적으로 다가오고 있는점이죠.
최근 개발언어가 자바스크립트 ES6이상으로 호환성이 확장이 되어
범용성에 더불어 다른 언어처럼 무거운 프로그래밍에도 사용이 가능합니다.
특히 템플릿 문법이 JSX(JavaScript XML)으로 XML에 익숙한 사람들에게 쉽게 받아들일 수 있고
자바스크립트의 가독성을 높이는것이 큰 장점입니다.
쉽고 편한 React
흔히 React를 이야기 할 때 항상 비교하는 프레임 워크가 바로 '#Angular.js' 입니다.
#JSX의 문법사용부터, React의 구조 특성상 심플한 점이 익히기에 쉽고 사용하기 편리합니다.
자바스크립트를 경험한 분들이라면 더욱 쉽게 느껴질겁니다.
또한 데이터 변경이 일어나면 일일이 자바스크립트 변수 값을 수정하여 DOM에 적용시켜 주어야 했는데,
React는 값 변경하면 자동으로 DOM 업데이트까지 해주어 편리합니다.
특히 개발 특성상 데이터 변경이 지속적으로 일어나는 환경이라면 더욱 유용한 프레임 워크입니다.
React의 핵심 #Virtual DOM
React의 핵심 기능이기도 한 Virtual DOM은 데이터를 dom으로 출력할때 바로 표시하는 것이 아니라
가상의 DOM을 생성하고, 여기에 한번 그린 후 기존 DOM과 비교하며
"다른" 부분만 새로 그리는 작업을 수행합니다.
모든 View를 다시 그리지 않고 변경된 부분만 수정하여 화면에 출력하기 때문에 성능에 큰 이점이 있습니다.
러닝클루만의 특별한 과정
"React를 활용한 웹 서비스 개발과정"
새로운 자바 스크립트 라이브러리에 대한 두려움이 있으신가요?
아직도 HTML으로만 웹 개발을 해오셨나요?
이제 러닝클루와 함께 쉽고 빠르게 웹 서비스를 개발해보세요!
과정은 단계별로 Basic과 Advance로 구분됩니다.
1. React를 활용한 웹서비스 개발 Basic
- React 개발에 필요한 환경을 구축 합니다.
- 새로운 자바스크립트 문법을 학습 합니다. ES2015(ES6), ES7, ES8
- 개발 편의를 위한 VSCode IDE를 학습 합니다.
- 기본적인 Git 사용법을 학습 합니다.
- PR 코드 리뷰를 응용한 개발 프로세스를 학습 합니다.
- React 로 간단한 노트 앱 제작합니다.
2. React를 활용한 웹서비스 개발 Advance
- React 를 응용해 컴포넌트를 넘어서 나만의 애플리케이션을 제작합니다.
- 트위터를 클론해보면서 애플리케이션 설계 원리를 이해합니다.
- 라우터의 개념과 상태 관리 라이브러리 Redux 를 학습합니다.
자세한 문의 사항은 아래 문의하기를 통해 연락 주시길 바랍니다.