Jeden Tag, aufrichtig und lustig.

JSX 문법은 자바스크립트 파일 내에서 html을 표현할 때 사용되는 문법이다. 리액트에서 많이 사용되는 JSX 문법은 아래와 같다. 1. className JSX 문법과 html 문법의 차이점 중에 하나로 class를 부여할 때 'className'으로 카멜케이스를 활용해서 사용 해야 한다. 이를 사용해서 app.js파일에서 클래스 이름을 부여 하면 app.css에서 css하는데 활용 할 수 있다. *css파일은 app.js파일 내에 import 해야 적용할 수 있다. 2. 데이터바인딩시 {중괄호} 활용 리턴 문 밖에서 정의한 변수를 리턴안에서 활용(데이터 바인딩) 하고 싶다면 중괄호 안에 변수를 넣으면 적용 가능하다. 변수는 컨텐츠 내용 넣을 때나 클래스 이름 작명 할 때도 범용적으로 사용가능하다 i..

style 시트 css 코드만 따로 관리하고 싶을 때 style태그 빼고 css부분을 잘라내기 해서 별도의 파일로 만들면 ex.style.css style시트로 관리하기 편하다. =>유지보수 효율성 올라감으로써 경제적 효과도 창출한다. 링크 태그를 사용함으로써 html파일과 css파일의 연결이 가능하다. *rel :relationship * text/css : link태그로 연결되는 파일이 어떤 것인지 알려준다.

grid 단락을 나란히 배치하고 싶다면 그리드를 활용 할 수 있다. 이를 위해선 부모태그로 각 단락을 묶어야 한다. 부모태그로 묶는 방법 를 활용 할 수 있다. 는 의미가 존재하지 않는 디자인을 위한 태그이다. navigation template ** css 선택자 특정하는 법 -> 부모 선택자 이름을 앞에 붙인다. ex. => 1) id가 grid값의 하위태그로 묶여있는 ol태그를 선택한다. 2) id가 grid값의 하위태그로 묶여있는 article id값을 선택한다.

CSS Cascading Style Sheets 1. html의 정보전달기능 집중을 위해 2. 효율적인 디자인을 위해 3. 유지보수의 편리성을 위해 css =/= html ->html이 css문법에 맞게 해석하도록 명령한다. ex. * 중복되는 코드 제거하는 것 =코딩 잘 하는 법 *주석 다는 법 ->웹브라우저는 주석내용을 없는셈 침. **해당 태그나 class, id에 css 값이 있다면 해당 스타일을 우선순위로 적용한다.