부트캠프교육중301 SPA # MPA (multi page application) 전통적인 웹사이트(MPA)에서는 페이지이동시 매번 HTML파일로 된 페이지 전체를 불러와야했다. 전통적인 웹사이트는 페이지 전체를 로딩하고 이와같이 페이지 전체를 불러오는 행위를 깜빡인다고 표현한다. # 전통적인 웹사이트의 한계와 단점 매번 중복되는 요소들을 매번 불러오는 것이 서버와의 불필요한 트래픽을 발생시켰다. 사용자와 서비스 사이의 상호작용 증가는 트래픽 증가와 사용자 경험의 저하를 야기했다. # SPA (single page application) -HTML문서 전체가 아니라 필요한 데이터만 받아, 자바스크립트를 통해 변경된 부분만 업데이트하여 다시 보여주는 방식 -menu와 footer와 같이 페이지 전환 전후에 중복되는 부분은 새로 불러.. 2023. 1. 25. undefined와 null 차이 undefined typeof undefined는 출력하면 undefined이다. 변수를 선언하고 값을 할당하지 않은 상태. null typeof null은 출력하면 object이다. 변수를 선언하고 빈값을 할당한 상태(빈객체). 2023. 1. 22. 변수를 적용하는경우 {tweet.username} 변수를 적용하게 바꾸는 경우 const Tweets = () => { return ( {dummyTweets.map((tweet) => { const parklassName = //여기에 변수추가!! tweet.username === 'parkhacker' ? 'tweet__username tweet__username--purple' : 'tweet__username'; return ( {tweet.username} //여기에 변수적용! {tweet.createdAt} {tweet.content} ); })} ); }; 2023. 1. 22. create react app # create react app -리액트 spa를 쉽고 빠르게 개발할수 있도록 만들어진 툴 체인이다. #폴더안에서 npx create-react-app 프로젝트명 이렇게 입력하면된다. cd codestates npx create-react-app react-project #package.json파일의 scripts부분에 start에 react-scripts start라고 쓰여있다. react-scripts start라고 터미널에 치는거랑 npm run start라고 터미널에 치는거랑 같은거다. npm run start를 치면 리액트앱이 뜨는걸 확인할수있다. (안되면 localhost:3000을 인터넷주소에 친다) index.js에 들어가면 이렇게있다 ReactDOM.render( , document.g.. 2023. 1. 21. 이전 1 ··· 53 54 55 56 57 58 59 ··· 76 다음