# JSX

455개의 포스트

JSX

jsx는 react에서 자바 스크립트와 html을 동시에 사용할 수 있도록 확장한 문법이다.위 코드에서 명확하게들어나는 차이점은 react create element함수를 통해서 위의 코드를 javascript 객체로 전환하는데 JSX코드를 사용하면 이를 자동으로 ja

어제
·
0개의 댓글
·
post-thumbnail

REACT -JSX 문법-

JSX 문법이란 JavaScript eXtension의 약자로서 리액트에서 html을 작성할 때 사용된다.Javascript에 XMl을 추가한 문법으로서 브라우저에 실행 전 Babel을 통해서 변환된다.JSX는 React의 React.createElement(compo

2일 전
·
0개의 댓글
·
post-thumbnail

[React] JSX란??

JSX는 JavaScript XML의 약자로 JavaScript를 확장한 문법입니다.JSX라고 하면 템플릿 언어가 떠오를 수도 있지만, JavaScript의 모든 기능이 포함되어 있습니다.자바스크립트에서 HTML을 작성하듯이 비슷하게 작성할 수 있도록 해 주는 것이 J

3일 전
·
0개의 댓글
·
post-thumbnail

[React] JSX란 무엇인가?

Javascript에 XML을 추가한 확장한 문법이다.리액트로 개발을 진행할 때 사용됨

5일 전
·
0개의 댓글
·

[React] JSX 문법

JS의 class 속성(class 선언 등.)과 충돌이 일어나기 때문에, JSX에서 class 속성을 부여할 때는 className으로 해줘야함.Html 코드 사이에 js문법을 적용하고 싶을 때, {}로 감싸줘야함예시id, className 등, 생각하는 모든 곳에 {

5일 전
·
0개의 댓글
·

React - JSX (2)

React에서의 CSS class 속성지정은 "className" 만약 class로 작성하게 된다면 React에서는 이를 HTML 클래스 속성 대신 자바스크립트 클래스로 받아들이기 때문에 주의하야 한다. JSX에서의 표현식 사용지 중괄호( {} ) 이용 중괄호를 사용

5일 전
·
0개의 댓글
·
post-thumbnail

React - JSX

JavaScript XML의 줄임말문자열도아니고 HTML도 아님React에서 UI를 구성할때 사용하는 문법으로 javascript를 확장한 문법이 문법을 이용해서 React 엘리먼트를 만들 수 있다.JSX는 javascript가 확장된 문법이지만, 브라우저가 바로 실행

5일 전
·
0개의 댓글
·
post-thumbnail

[개인 스터디] 리액트를 다루는 기술 - 2장 JSX

[개인 스터디] 리액트를 다루는 기술 - 2장 JSX

7일 전
·
0개의 댓글
·
post-thumbnail

💻 JSX 이해하기(feat. 리액트 공식문서)

> ⚠️ 정리한 내용은 오타나 잘못된 정보가 있을 수 있습니다. 댓글로 알려주시면 감사하겠습니다. 근본적으로 JSX는 `React.createElement(component, props, ...children)` 함수에 대한 문법적 설탕을 제공할 뿐

2022년 11월 23일
·
0개의 댓글
·
post-thumbnail

[ React ] React를 사용하는 이유?

👇 선행 개념 사용자 인터페이스(UI, User Interface) : UI는 사용자가 제품/서비스를 사용할 때, 마주하게 되는 면 = 사용자가 제품/서비스와 상호작용할 수 있도록 만들어진 매개체를 말한다 사용자 경험(UX, User Experience) : 사용자 경험, 어떠한 제품/서비스를 직간접적으로 이용하며 느끼는 종합적인 만족을 말한다 > ...

2022년 11월 22일
·
0개의 댓글
·
post-thumbnail

jsx,tsx에서도 vscode-color-picker 사용하기.

편하게 색 맞추고 싶어잉

2022년 11월 17일
·
0개의 댓글
·
post-thumbnail

React에서 JSX를 사용 안하면 어떻게 동작할까?

리액트를 쓰면 자연스럽게 JSX를 사용하게 되는데 이게 필수는 아니지만 HTML과 비슷하기 때문에 코드 작성과 가독성 측면에서 우리에게 친숙하고 편해서 많이 사용하고 있다.리액트 공식 문서에서도 JSX 소개에 JSX를 리액트와 함게 사용할 것을 권장하고 있을 정도이니까

2022년 11월 15일
·
0개의 댓글
·
post-thumbnail

[React] JSX 소개

HTML과 비슷한 태그를 사용해 구문을 정의 하며, 자바스크립트를 확장한 문법.

2022년 11월 15일
·
0개의 댓글
·

TypeScript 에서 .ts 와 .tsx 의 차이

회사 코드를 보다가, 갑자기 의문이 생겼다..ts 파일도 존재하고 .tsx의 파일도 존재했다.둘이 차이가 무엇인지 궁금해져서 구글링을 해본 결과, TSX에서는 JSX문법을 사용 할 수 있다.그러면, .ts 에서 jsx문법을 사용하게 되면 어떻게 될까?불가능!!.tsx로

2022년 11월 15일
·
0개의 댓글
·

2. JSX

jsx는 자바스크립의 확장 문법 자바스크립트 함수선언 + HTML 표현 UI/UX적으로 더 쉽게 볼수 있고, 코드가 짧아서 좋음 표현식 예시 문법 예시 리액트 문법

2022년 11월 14일
·
0개의 댓글
·
post-thumbnail

[React] 자바스크립트 확장 문법 'JSX'에 대해

JSX는 React에서 HTML을 표현할 때 사용되는 JavaScript 확장 문법이다. HTML 문법을 JavaScript와 혼용해서 사용해 React Element를 생성할 수 있다.HTML 리터럴 같지만 실제 빌드시에는 Babel이라는 compiler를 통해 일반

2022년 11월 13일
·
0개의 댓글
·
post-thumbnail

jsx

jsx

2022년 11월 9일
·
0개의 댓글
·
post-thumbnail

[소플 : React] 3. JSX

Chapter 3. JSX

2022년 11월 8일
·
0개의 댓글
·

JSX, Props, State

코드 import 구문이 사용되었고 이 의미는 특정 파일을 불러오는 것을 의미한다. 리액트로 만든 프로젝트의 js파일에서는 import를 사용하여 다른 파일들을 불러와 사용이 가능하다. >모듈을 불러와서 사용하는 것은 원래 브라우저에는 없던 기능이다. 브라우저가 아

2022년 11월 5일
·
0개의 댓글
·