당근먹는하니
귀엽고 행복해
당근먹는하니
전체 방문자
오늘
어제
  • 분류 전체보기 (274)
    • 다람쥐🐿 (26)
    • C++ 공부빵야 (7)
    • 공부👻 (5)
    • 프론트엔드✏️ (228)
      • 코드캠프 (120)
      • 팀 프로젝트✨ (31)
      • 개인공부 (67)
    • 프론트엔드 - 바닐라js (7)

블로그 메뉴

  • 홈
  • 태그
  • 방명록

공지사항

인기 글

태그

  • 팀 프로젝트
  • 팀플
  • 코딩 부트캠프
  • HTML
  • emotion
  • 리액트
  • ssg
  • JS
  • javascript
  • react
  • javascrpit
  • 팀프로젝트
  • 공통 컴포넌트
  • refreshtoken
  • 배포
  • CSS
  • typescript
  • React-hook-form
  • 프론트엔드
  • 회고
  • 부트캠프
  • 코딩
  • 프로그래머스
  • 배열
  • algorithm
  • 자바스크립트
  • graphql
  • 코드캠프
  • 알고리즘
  • next.js

최근 댓글

최근 글

티스토리

250x250
반응형
hELLO · Designed By 정상우.
당근먹는하니

귀엽고 행복해

프론트엔드✏️/코드캠프

라이브러리와 프레임워크, JSX(JavaScript XML)

2022. 5. 15. 00:19
728x90
반응형

  JSX (JavaScript + XML)

JSX는 JavaScrpit 확장 문법이다. 

HTML과 JavaScrpit를 합친 것이다.

브라우저는 내부적으로 JSX를 읽을 수 있는 구조가 아니다. 애초에 JSX는 엔진이나 브라우저가 바로 구현할 수 있게끔 만들어진 것이 아니라, 다양한 변환 프로그램을 통해 사용되도록 만들어진 것이기 때문이다. 

 

자바스크립트와 약간 문법이 다르다. 

ex. class="" 라고 쓰지 않고 className="", onclick이 아니라 onClick 등 

ㄴ 이유는?! classr가 자바스크립트에서 예약어기 때문에 HTML 의 엘리먼트 class를 정의하려면 다른 이름을 써야한다.

 

리액트 컴포넌트는 일반적으로 JSX로 작성된다. 

 

  라이브러리, 프레임워크 

[공통점]

다른 사람이 쓴 코드를 가져다 쓰는 것

 

[차이점]

내가 코드를 조작한다. - 라이브러리

누군가 정해준 규칙을 따른다. - 프레임워크

라이브러리 (ex. jQuery)

 - 다른 것으로 대체 가능함

 - 필요할 때만 불러서 사용

 

프레임워크 (ex. django)

 - 어디에 템플릿을 넣을지, 어디에 뷰를 넣을지 정해져있음.

 - 프레임워크가 나를 부름

 

리액트? 

 - 내가 필요할 때 부르는 것이니 라이브러리

 - 리액트가 컴포넌트를 부름. 규칙을 알려줌. 이렇게 보면 프레임워크

 즉 규정하기 어렵다! 

 

728x90
반응형
저작자표시 비영리 동일조건 (새창열림)

'프론트엔드✏️ > 코드캠프' 카테고리의 다른 글

React : Component, Import & Export  (0) 2022.05.15
React Router : 리액트 라우터  (0) 2022.05.15
220514 프론트엔드 부트캠프 6일차 : 첫 주말  (0) 2022.05.14
220513 프론트엔드 부트캠프 5일차 :  (0) 2022.05.14
2205112 프론트엔드 부트캠프 - 4일차  (0) 2022.05.13
    '프론트엔드✏️/코드캠프' 카테고리의 다른 글
    • React : Component, Import & Export
    • React Router : 리액트 라우터
    • 220514 프론트엔드 부트캠프 6일차 : 첫 주말
    • 220513 프론트엔드 부트캠프 5일차 :
    당근먹는하니
    당근먹는하니

    티스토리툴바