최근 본 모임

1/1
무료 교육 공개

신고하기

해당 모임의 취지가 다르거나 부적절한 모임일 경우 신고를 할 수 있습니다. 신고된 모임은 부적절한지의 여부를 결정하여 삭제 또는 경고의 조치가 주어지며 신고 기능을 악용하는 것도 위반여부를 판단하여 사용에 제한이 있을 수 있으니 주의하시기 바랍니다.

신고 사유
[프론트엔드 무료교육] 웹 프론트엔드 (Bootstatrap.Angular JS) 및 자바(JAVA) 개발자 국비지
  • kakaostory

[프론트엔드 무료교육] 웹 프론트엔드 (Bootstatrap.Angular JS) 및 자바(JAVA) 개발자 국비지

  • 모임기간

    2019.6.11 (화) 09:30 ~ 2019.12.11 (수) 18:30

  • 모임장소

    [세경빌딩]서울특별시 강남구 테헤란로1길 10 3층

  • 모집정원

    8

- This is 'React JS'

자바 스크립트 프레임워크라고 하면 보통 일반적으로 떠올리는 앵귤러(Angular JS)가 있습니다. 하지만 리액트는 이와 같은 프레임워크가 아닌 사용자 인터페이스 라이브러리입니다.
리액트는 페이스북 그리고 인스타그램의 개발자들이 만들어 2013년에 알려져서, 최근에는 페이스북과 인스타그램뿐만 아니라 에어비앤비나 야후 등 많은 곳에서 사용되고 있습니다.

여러가지 쉬운 설명들이 많이 있지만 프레임워크는 큰 틀이 다 갖추어져 있기 때문에 사용자는 일부의 필요한 부분만 조정하고 만들면 완성되고, 라이브러리는 연장이나 도구와 같아서 본인이 무언가를 직접 만들어 하나하나 완성하면 되는 것이죠.
예를 들어 라이브러리는 망치나, 삽과 같은 도구로 생각하면 쉽습니다. 직접 두들기고, 파고, 필요한 것을 얻기 위해 이러한 작업을 직접하여 시간은 좀 더 걸리지만 원하는 목표를 이룰 수 있는 것이구요. 프레임워크는 이미 만들어진 자동차나, 배 또는 비행기와 같은 탈것으로 생각하면 됩니다. 어떻게 만들어지는지 알 수 없고 그 자체에 대한 활용능력 없이도 이미 있는 교통수단을 통해 원하는 목적지, 목표에 도달 할 수 있는 것입니다.

- 리액트(React JS)의 특징

1. JUST the UI
2. Virtual DOM
3. DATA Flow

리액트의 가장 큰 특징은 MVC (Model View Contoller) 패턴에서 컴포넌트를 통해 View를 표현하는 것만 집중하고 있다는 것입니다. 따라서 UI 개발자의 경우는 리액트를 사용했을 때 큰 메리트를 느낄 수 있는 것이죠.

두 번째로 커스텀 태그라고 하는, 커스터마이징 된 나만의 태그를 만들 수 있고 그것으로 웹 개발이 가능한 방식을 지원한다는 사실입니다. 커스텀 태그가 좋은 이유는 기능을 모듈화하기 때문에 코드 이해를 하는 것이 간단하고 쉬워질 뿐만 아니라 개발자가 코드를 수정하거나 다시 사용하기 쉽기 때문이에요.
그 밖에도 리액트는 가상 DOM 지원, 단방향 데이터 바인딩 기능을 제공합니다.

- 리액트(React JS)와 다른 자바스크립트 프레임워크와의 차이점

대표적인 자바스크립트 프레임워크로는 앵귤러(Angular JS)가 있습니다. 앵귤러는 양방향 데이터 바인딩을 사용하기 때문에 단방향인 리액트와 차이를 갖지만 그렇다고 해서 리액트가 앵귤러보다 적은 코드 양을 사용한다는 것은 아니에요. 오히려 모델 컴포넌트에서 UI 컴포넌트로 전달하는 방향이 단방향이라 이해하기도 관리하기도 쉽다는 장점이 있어요.
또 앵귤러나 앰버 등 여타의 자바스크립트 프레임워크는 검색엔진에서 찾지 못한다는, 바로 검색엔진 최적화의 문제가 있었습니다. 게다가 사용자가 페이지에 처음으로 접속할 때는 렌더링 하는 시간이 걸려서 느리게 느껴지는 단점이 있었기 때문에 페이스북이 리액트를 개발하게 된 것이죠.

- 리액트(React JS)의 운명

리액트는 프론트엔드단의 모든 프레임워크 (예를 들어 라우터나 모델과 같은)를 제공하지 않기 때문에 다른 프레임워크도 함께 써야 할 경우가 종종 발생합니다. 그러나 리액트의 특징에서 설명해 드렸던 듯 MVC 중에서 View에 집중하는 컴포넌트 라이브러리이기 때문에 어쩔 수 없는 부분이라고 말할 수 있겠네요.

- 리액트(React JS)와 리액트 네이티브(React Native)

리액트 네이티브라는 프레임워크를 들어보셨나요? 쉽게 말해 모바일 앱 개발을 위한 자바스크립트 프레임워크로 웹뷰(Webview)를 사용하지 않는다는 특징이 있습니다. 종종 다른 블로그의 글을 보면 안드로이드 앱 개발과 iOS 개발을 동시에 다 할 수 있다며 찬양하는 글을 볼 수 있지만 사실 80% 정도만 커버 가능하고 나머지는 각각 다르게 만들어 가야 합니다. 대신 웹에서 사용하던 리액트(React JS)를 모바일로 그대로 가져와서 쓸 수 있다는 장점이 있죠.

- 프론트엔드 개발을 위한 선택

리액트는 빠른 변화에 맞추어 업데이트 주기 역시 빠릅니다. 웬만한 라이브러리나 앵귤러에 비해 속도 역시 굉장히 빠르고 컴포넌트의 모듈화는 일반적인 템플릿 엔진을 쓰는 것보다 훨씬 더 깔끔하게 정리할 수 있고요. 그러나 만약에 이미 기존에 쓰던 프레임워크가 있다면 지금부터 바꿔서 쓰실 필요는 없을 것 같습니다. 리액트가 지금보다 더 단점을 개선하고 보완해서 많은 기능들을 완성한 후에 써도 아직은 늦지 않으니까요.

최근 앵귤러 2와 비교되며 무엇을 쓰는 게 더 편하고 좋은지에 대한 이야기가 많이 나오는데요. 사실 이것은 프론트엔드 개발자 개인의 선택 문제라고 말씀드릴 수 있을 것 같아요. 만약에 복잡하고 큰 UI 표현과 앞서 말씀드린 렌더링 속도에 포커스를 둔다면 당연히 리액트가 좋은 선택입니다.

신청기간 2019.4.16 (화) 19:00 ~ 2019.4.23 (화) 18:30

  • 무료
    선착순 정원 8
    마감
신청 가능한 최대 그룹수는 1개 입니다.
참여 신청이 마감되었습니다

지도보기

[세경빌딩]서울특별시 강남구 테헤란로1길 10 3층

문의/기대평 (0건)

기대평이나 문의사항을 댓글에 남겨주세요.

첫번째 댓글 작성자가 되어보세요.

참여신청/취소 안내

  • * 모임의 신청/취소/변경/환불은 참여신청 기간 내에만 가능합니다.
  • * 결제한 유료모임은 환불 시 결제 수단과 환불 시점에 따라 수수료가 부과될 수 있습니다. 자세한 사항은 취소/환불약관을 확인해주세요.
  • * 결제, 환불, 참여신청 수정/취소, 참여상태 확인, 참여내역 확인은 마이페이지에서 할 수 있습니다.
  • * 모임 또는 그룹의 설정, 모집정원 초과 여부에 따라 대기자로 선정될 수 있습니다. 자세한 사항은 FAQ를 확인해주세요.
  • * 온오프믹스 결제서비스를 이용하는 모임은 개설자의 사업자 여부에 따라 결제증빙 발행이 가능합니다. 자세한 사항은 FAQ를 확인해 주세요.
  • * 개설자 선정방식 또는 개설자 통장입금 방식의 모임 참여/결제 확인은 개설자에게 문의 바랍니다.
  • * 온오프믹스는 참여신청 및 참가비 결제 기능을 제공하는 회사로 모임개설자(주최측)가 아닙니다. 모임 내용과 관련한 사항은 모임 개설자에게 문의 바랍니다.

HOT ISSUE

종료된 모임입니다

[2019년 7차 굿인터넷클럽(8/27(화)]
[2019년 7차 굿인터넷클럽(8/27(화)] "부동산의 미래를 보라, 프롭테크(Proptech)란 무엇인가?"
부동산에도 새로운 혁신이 일어났습니다. 프롭테크가 바로 그 혁신을 지칭하는 단어입니다. 아직은 생소한 프롭테크는 프로퍼티와 테크놀리지의 합성어인데요, 글자 그대로 부동산 서비스에 새로운 기술이 접목된 것을 의미합니다. ioT가 접목된 건물관리부터 VR이 적용된 실내공간정보까지 부동산 관련 전 산업분야에 새로운 트렌드가 될 프롭테크에 대해서 함께 알아봅시다.
무료 전시/박람회
2.8~2.9
4명 신청가능