본문 바로가기

𝓡𝓸𝓸𝓶3:𝐹𝓇𝑜𝓃𝓉𝑒𝓃𝒹

(5)

[React] 2. 컴포넌트 컴포넌트 개발에 앞서 개념을 간단히 설명해보자. 이전에 우리는 html로 다음과 같이 코딩을 할 수 있었다. WEB> world wide web! HTML 하지만 만약 저 header부분의 코드가 1000만 줄이라면? 저걸 다 index.html 파일에 넣어버리면 난잡하고 보기 어려워 지겠지? 그래서 이것을 일종의 치환을 해준다. ~부분의 코드를 예를 들면 태그 한 줄로 치환을 해주는 것이다. App.js 파일을 열어 다음과 같이 class 를 선언해준다. class Subject extends Component{ render(){ return ( Web world wide web! ); } } 그리고 아래에 있는 App class 코드를 다음과 같이 바꿔주면! class App extends Compo..

[CSS] 1. 기본문법 CSS : Cascading Style Sheet css는 html파일에서 style, 즉 css 코드 안에 #id를 쓰고 속성을 정의해주면 된다! 그러면 이렇게 list 중 한 개의 리스트에만 속성을 적용할 수 있다! +padding은 안쪽 간격, margin은 바깥쪽 간격이다. xml이랑 굉장히 유사하군 예제 3도 구현해보자 생활코딩의 세계에 오신 것을 환영합니다. 생활코딩은 일반인들에게 프로그래밍을 알려주는 것을 목적으로 하는 비영리 활동입니다. 그간 프로그래머들이 이룩한 성취를 일반에 알려서 고독한 프로그래머들의 관객을 모객하는 활동이기도 합니다. 생활코딩은 세 가지로 구성되어 있습니다. 온라인 강의 생활코딩의 강의는 수업과 사전으로 구성되어 있습니다. 입문자의 가장 큰 고충은 '무엇을 모르는지 ..

[HTML] 2. 의미론적인 웹 JavaScript란? JavaScript란? 변수와 상수 연산자 변수와 상수 변수란 변하는 값 x=10일 때 왼쪽항 자, 이 코드를 돌리면 요롷게 잘 나온다. 이렇게 짜도 되지만! 우리는 1,2,3이 메뉴라는 것을 이해시키기 위해, 기능은 없지만 이 태그 안에 있는 콘텐츠가 웹사이트를 탐색하는 navigation임을 알려주는 태그를 사용할 수 있다. 또한 JavaScript가 웹사이트 전체를 설명하는 header의 역할을 한다는 것을 알려주는 JavaScript란? JavaScript란? 변수와 상수 연산자 변수와 상수 변수란 변하는 값 x=10일 때 왼쪽항 요로코롬!

[HTML] 1. HTML 기본 문법 HTML = HyperText Markup Language 사람도 알아들을 수 있고, 웹 브라우저도 알아 들을 수 있는 언어 하이퍼 텍스트 (링크) 링크로 연결된 거대한 정보 덩어리 = WEB 링크는 HTML의 본질, HTML의 본질은 웹의 본질 Markup Language - Tag (시작태그, 끝태그) ex) 강조 ex) 안녕하세요. 생활코딩 입니다. 참고) VS Code에서 open in browser를 깔고 html파일에 우클릭 한 후 open with default browser를 누르면 HTML코드를 브라우저로 열어서 확인할 수 있다. 1) a 태그 = url, 링크 안녕하세요. 생활코딩 입니다. href = 속성명, 약속되어 있음. (hypertext reference) href로 연결할 u..

[React] 1. 리액트란? + 개발 환경 설정 react : 사용자 인터페이스를 만들기 위한 Java Script 라이브러리(프레임워크) - 인터페이스를 편하게 만들 수 있음, 사용자 경험이 좋음 Single page application , 페이지 넘어가는게 자연스러움 - 데이터 처리 편하게 하려고 (데이터와 화면 일치시키는게 좋아짐) - 컴포넌트들(조각들) 재사용 가능 사용자 정의 태그를 만드는 것 (= 컴포넌트) -> 가독성 높일 수 있음 -> 재사용 가능 -> 유지보수의 편리성 curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.2/install.sh | bash bash install_nvm.sh source ~/.profile nvm ls-remote 이렇게 nodejs와 npm을 깔..

이전 1 다음

티스토리툴바