Next-BlockChain

자바스크립트에서 배열 안의 요소가 1개 또는 2개라면 하드코딩으로 {}표현식을 이용해서 표현해도 될것입니다. 하지만 배열 안의 요소가 100개, 1000개라면 어떨가요?? 이럴 경우에 하드코딩을 하는 것은 바보같은 짓입니다. 그래서 이런 경우에는 자바스크립트의 고차함수인 map을 사용하면 간단히 해결할 수 있습니다. 고차함수 map의 특징은 다음과 같습니다. 배열의 각 요소를 특정 논리(함수)에 의해 다른 요소로 지정(map)합니다. map의 디테일한 사항은 여기 mdn에서 보실 수 있습니다. 다음 코드를 예시로 들면 posts요소는 id, title, content로 나눌 수 있습니다. 여기서 map 메소드 사용시 key를 써야하는데 가장 적절한 데이터는 id입니다. 이유는 데이터마다 분별할 수 있고 ..

Web/React 2023. 1. 1. 15:38

Git repository 가져오기 git clone https://github.com/kimcoding/test.git Git 상태 확인 git status Staging area로 더하기 git add . (현재 폴더 전체) git add index.js (특정 파일만) Commit하면서 메시지 남기기 git commit -m "index.js 수정" 방금 실행한 커밋취소하기 git reset HEAD~1 git reset HEAD^1 git reset HEAD^ 내 깃헙 origin 레퍼지토리의 main으로 푸쉬하기 git push git push origin main 내 커밋 로그를 확인하기 git log git 연결하기 (내 로컬 디렉토리를 git의 관리하에 들어가게 하기) git init or..

Web 2023. 1. 1. 15:13

node.js는 브라우저를 제외한 환경에서 자바스크립트를 실행할 수 있는 툴입니다. 하지만 이걸 별도로 설치해서 관리하려면 버전을 관리하기 어렵습니다. 그래서 이런 node.js의 버전을 관리하기 위해 만들어진 프로그램이 있습니다. 그게 바로 nvm(node version manager)입니다. 1. nvm 설치 Installing and Updating Install & Update Script To install or update nvm, you should run the install script. To do that, you may either download and run the script manually, or use the following cURL or Wget command: nvm을 ..

Web/NodeJS 2023. 1. 1. 15:01

Javascript 런타임(runtime)이란 무엇일까요?? 런타임이란 정말 무엇일까요?? 그렇게 어려운 개념이 아닙니다. 크롬, 사파리 같은 웹브라우저도 Javscript 런타임이고 백엔드 프레임워크로 유명한 Node JS도 Javscript 런타임입니다. 런타임이란 프로그래밍 언어가 구동되는 환경입니다. 런타임이란 어떤 프로그램이 동작할 때, 프로그램이 동작하는 곳입니다. 웹브라우저에서 동작하면 웹브라우저가 런타임이고 서버에서 동작하면 서버가 런타임입니다. 브라우저 런타임환경 크롬 오른쪽 상단에 점3개 버튼을 클릭 >>> 도구 더보기 >>> 개발자 도구 클릭 서버 런타임환경 서버에서 Node Js를 설치한 다음 다음과 같이 진행 Node Js 공식홈페이지 : https://nodejs.org/en/ ..

Web/NodeJS 2022. 12. 23. 22:35

JSX JSX란 JavaScript XML의 줄임말로 React에서 쓰는 JavaScript 문법입니다. 이 JSX를 이용해서 보통 UI를 구성하고 React Element를 만들 수 있습니다. 그렇다면 JSX만 있다고 바로 Javascript를 실행할 수 있을까요? 안됩니다. 그렇다면 어떻게 브라우저에서 해석할까요?? 바로 Babel이 React의 JSX를 우리가 아는 Javascript로 컴파일 해줍니다. JSX의 컴파일 순서는 다음과 같습니다. JSX --->>> Babel(Compile) --->>> JavaScript --->>> Browser(Chrome, Firefox, Edge) React는 DOM과 다르게 JSX와 CSS만으로도 웹앱을 개발할 수 있습니다. 또 DOM 코드보다 좀 더 직관..

Web/React 2022. 12. 20. 22:53