전체 글 (131) 썸네일형 리스트형 [ReactJS] 왜 React JS를 쓰는가? (4) : JSX, Babel - react element를 더 쉽게 생성해 보자 복습) reactJS 패키지/라이브러리 는 우리가 Element를 생성하고, 인자안의 프로퍼티 로서 eventListener를 생성하는데 반드시 필요하다. 즉 interactive 한 power가 모두 이 패키지 안에 있다. react-DOM 패키지/라이브러리가 필요했더 이유는 이 React Element를 HTML로 바꿔야 했기 때문이다. React 개발자로서 createElement를 다시 쓸 일은 다시는 없을 것이다. React element를 더 쉽게 생성하는 방법 props 안에 event listener를 달아줄 수 있었다. console.log("entered!") }, "Hello, I'm span" ); 이전의 Hard Way를 아래와 같이 써줄 수 있다. 굉장히 HTML 문법과 비슷하게.. [ReactJS] 왜 React JS를 쓰는가? (3) : React JS는 Interactivty 을 위해서 제작된 것이다.- react js vs vanilla js React JS는 Interactivty 을 위해서 제작된 것이다. 본격적으로 Javascript로 HTML을 조작해 보자. 이렇게 div 안에 span 과 button 을 두개다 넣어주는 작업을 Javascript로 하려면 어떻게 해야할까? 배열로 이둘을 createElement()의 세번째 인자에 넣어주면 된다. (Javascript로 document로 가져온 element에 다른 element를 추가해 줄때에는 appendChild() 를 해주었다.) object로 주어진 element의 프로퍼티 안에서는 id 나 class 값, style 값들을 변경하는 것 말고도 eventListener을 추가해 줄 수 가 있다. 바로 {onClick : () => console.log("I'm clicked".. [ReactJS] 왜 React JS를 쓰는가? (2) : 동작방식의 차이- react js vs vanilla js [1편] https://mswait.tistory.com/91 [ReactJS] 왜 React JS를 쓰는가? (1) : react 기본 세팅, react js vs vanilla js 기술이 해결하고자 하는 문제 그것을 잘 이해하면 보다 기술에 대한 이해를 높일 수 있다. 그래서 ReactJS의 포인트가 뭐야? 직접 해결하려는 문제를 겪어보지 않는다면, 결국 암기를 해야만 할 것 mswait.tistory.com React JS Element 생성하기 React JS 의 규칙 HTML 페이지에 Element를 직접 적지 않는다. 그 대신 Javascript 코드를 이용해서 span, button 등을 생성한다. Hard Way - 이 방식을 이해해야 본질을 알 수 있다. const span = Reac.. [ReactJS] 왜 React JS를 쓰는가? (1) : react 기본 세팅, react js vs vanilla js 기술이 해결하고자 하는 문제 그것을 잘 이해하면 보다 기술에 대한 이해를 높일 수 있다. 그래서 ReactJS의 포인트가 뭐야? 직접 해결하려는 문제를 겪어보지 않는다면, 결국 암기를 해야만 할 것이다. 해결하고자 하는 문제를 제대로 이해하지 못한다면 그 해결책이 잘 이해가 되지 않을 것이다. React JS 는 UI를 interactive 하게 만들어 준다. 아주 간단하게, 왜냐하면 그걸 위해 태어났기 때문이다. Javascript 으로 버튼을 클릭하면 클릭한 횟수가 보여지는 페이지를 제작한다고 생각해보자. html 에서 button 태그를 만들어야 할테고, querySeletor로 button 태그를 가져와야할테고 거기에 맞는 eventListener를 addEventLister()를 통해 지정해 줘.. [ReactJS] 리액트를 배워야 하는 이유 Learn Once, Write Anywhere 개발자 한테 가장 중요한 것은 '시간'이다 그러므로 시간을 투자해 배운 기술이 오랫동안 활용 되는 것이 중요할 것이다. 아래 질문과 그에 대한 React JS의 답변이 왜 React JS가 배우기 좋은 언어인지를 설명해 줄 것이다. 1. 누가 이 기술을 사용하느냐 2. 규모는? 3. 그리고 이 기술이 그들에게 얼마나 중요한가 - 전세계 상위 1만개의 웹사이트 중 44.76% 가 ReactJS 를 사용한다. - 에어비앤비, 인스타그램, 페이스북, 넷플릭스 - 페이스북이 계속 개발하고 있다. 엄청난 투자를 계 속 하고 있고 Facebook 도 reload 했다. - Javascript 와 가깝다. 그래서 거대한 커뮤니티를 가지고 있다. - ReactJS 를 배.. [Git] github.io 사용하기 github.io 는 github에서 무료로 제공하는 서비스이다. 내가 작업한 웹사이트가 있다면 github repository를 username.github.io 로 지어서 올리면 다음과 같이 링크로 접속이 가능해진다! 매우 간단하다. https://sa03134.github.io/ Document sa03134.github.io [Git] git 삭제하기, git 초기화 (username.github.io) 상황 프로그래밍은 다했고 이제 최종본을 새로운 git repository에 올리고 싶다.(username.github.io) 이전에도 프로젝트를 github 에서 관리한 터라 .git 은 있었다. 그래서 git init 도 해보았지만 git log 로 이전께 확인이 돼고 이전 커밋들이 다 담긴 git push 가 자꾸만 이뤄졌다. 해결 1. .git 파일을 삭제해준다. rm -rf .git 2. 새로운 .git 생성 git init 3. 깃허브 리포지토리, 원격 저장소의 url를 .git 에 연결 git remote add origin 4. 작업한 내용 전부 add git add . warning 해결방법이 궁금하면 아래 https://mswait.tistory.com/17 [Git] git add . .. [Git] .gitignore touch .gitignore vi .gitignore로 파일에 git 에서 추적하지 않을 파일 목록을 작성하러 들어간다. i 를 눌러 (INSERT) 모드를 실행 시켜 입력을 해준뒤 ESC 를 누르고 :wq 로 저장하고 나간다. https://devlog-wjdrbs96.tistory.com/237 [Git] gitignore란 무엇일까? Github에서 Repository를 보다보면 위와 같이 .gitignore 파일을 본적이 있을 것이다. 이번 글에서는 .gitignore가 어떤 역할을 하는지에 대해서 정리해보려 한다. .gitignore란? .gitignore파일이란 Git 버전 관.. devlog-wjdrbs96.tistory.com 이전 1 ··· 3 4 5 6 7 8 9 ··· 17 다음