react7 (React) NextJS 목차 1. Next.js 란? - SSR ↔ CSR 이란 2. Nex.js의 주요 기능 3. 기본 설정 및 실행 결과 Next.js 란? React를 기반으로 기존의 CSR(Client Side Rendering)아 아닌 SSR(Server Side Rendering)을 간편하게 사용할 수 있게 해주는 프레임 워크 SSR이란? (Server Side Rendering) ↔ CSR (Client Side Rendering) 웹 애플리케이션 랜더링 방식으로 사용자가 웹페이지에 접근할 때, 요청받은 서버는 완전하게 만들어진 HTML(CSS가 적용된)과 JS코드를 브라우저에게 응답해준다 이후 브라우저는 HTML을 띄워줌에 이어서 JS코드를 다운하고 실행한다. 이에 CSR보다 빠른 초기 로딩이라는 장점이 있다. .. 2023. 6. 14. (BlockChain) Truffle로 MetaMask와 React,Express 연결 최근에 작성한 이전 게시물에서 Truffle을 이용하여 MetaMask와 React 환경의 Front를 연결했다 이번에는 거기에 Express 환경까지 연결하여 Axios 통신을 이용해 보도록 한다 먼저 Express환경을 설치할 폴더를 만들어서 다음 명령어를 실행한다 npm init -y 이후 필요한 라이브러리를 설치해 준다 npm i express cors truffle web3 truffle 라이브러리가 설치되었다면, 그 환경에 맞게 다음 명령어로 기본 설정을 해줘야 한다 npx truffle init 이 명령어가 정상적으로 작동했다면 3개의 폴더 1개의 js 파일이 생성된다 contracts Smart Contract 코드 작성 폴더이다. Solidity언어로 작성한 코드를 여기에 작성하면 된다고.. 2023. 3. 5. (Project) TeamProject JJJJ (Reactjs) React를 열심히 하다가... 또 어느덧 끝날 무렵 TeamProject가 잡혔다 (기간 : 22.12.09 ~ 22.12.30) 저번 Nodejs에 이어서 또한 나는.. 팀장을 하게 되었고, 저번과는 다르게 이번에는 많은 준비를 해놓아야겠다는 생각이 들었다 그래서 미리 공지사항 같은 것도 적어보고 GitHub repository도 만들어 놓고 기본적인 틀 마저 잡아 놓고 팀원들을 초대해서 편히 이용할 수 있게 했다 ( 사실 나중에 통합할 때 편할려고 .. ㅋㅋㅋㅋㅋ) 팀명은 어떻게 할까 ? 라고 한마디 했는데 금방 정해졌다 저희 4명다 J 들어가는데 빨리 발음하면 JJJJ geegeegee 소녀시대 가시죠! 뭐지?? ㅋㅋㅋㅋ 오케이 그래 가자! 그리곤 각자 구현 하고자 하는 부분을 정리하려고 했는데 .. 2023. 2. 27. (React) Component React Component React로 만들어진 웹을 구성하는 최소한 단위 기존의 웹 프레임워크는 MVC 방식으로 각 요소의 의존성이 높다, 재활용이 어렵다 Component는 MVC의 View를 독립적으로 구성이 가능하며 쉽게 만들 수 있다 Component의 이름은 항상 대문자로 시작 UI를 재사용이 가능한 개별적인, 독립적인 여러 조각(Components)으로 나누고, 각 조각(Component)을 개별적으로 나누어 코딩한다 Javascript 함수와 유사하다 임의의 props 데이터를 받은 후 화면에 어떻게 표시되는지를 기술하는 React 객체를 반환 종류 함수형 컴포넌트 (Functional Component) 함수형에서는 함수 자체가 return 생명주기가 클래스형 컴포넌트와 다르다, 리랜더.. 2023. 2. 7. 이전 1 2 다음
