반응형 nodejs6 깃허브 데스크탑 - Node JS 프로젝트 추가하기 (new repository) Git / GitHub 전체 링크 Node JS 전체 링크 GitHub Desktop에서 ▼ → Add → Create new repository를 선택한다. Local Path의 root 경로와 upload 할 프로젝트의 폴더명을 확인한다. 또는 File → Add local repository... 에서 프로젝트 경로를 추가한다. Name - Node js의 프로젝트 폴더를, Local Path에서는 위의 Local Path를 입력하고 Git ignore에서는 Node를 선택한다. Publish repository를 선택하여 현재 프로젝트를 올린다. History를 눌러보면 현재 프로젝트 내용을 볼 수 있다. https://bloodstrawberry.tistory.com/673 위 링크대로 다시 n.. 2022. 4. 4. Node js, React 파일 관리 시스템 만들기 (5) 프로젝트 전체 링크 이전 - (4) 원하는 확장자의 파일만 불러오기 현재 - (5) 최상위 폴더 목록으로 option 만들기 다음 - (6) option을 toggle button으로 변경하기 깃허브에서 코드 확인하기 가장 상위 폴더인 2020 ~ 2022 폴더를 불러와서 아래의 option에 넣어보자. MyOptions.js를 만들고 form안에 option을 만들어둔다. //MyOptions.js import React from "react"; const MyOptions = () => { return ( Version : 선택하세요. 2020 2021 2022 ); }; export default MyOptions; App.js에 MyOptions를 추가한다. //App.js import MyOpt.. 2021. 7. 14. Node js, React 파일 관리 시스템 만들기 (4) 프로젝트 전체 링크 이전 - (3) 파일과 폴더 목록 불러오기 현재 - (4) 원하는 확장자의 파일만 불러오기 다음 - (5) 최상위 폴더 목록으로 option 만들기 깃허브에서 코드 확인하기 이제 이전 글에서 만든 폴더를 적당한 위치로 옮겨둔다. 그리고 해당 폴더의 절대 경로를 const로 선언하고, export 한다. //nodelibrary.js const MY_SERVER = `http://192.168.55.120:3002`; export const PATH = `C:\\YOUR_WINDOW_PATH\\TESTFILES`; nodeTest를 아래와 같이 변경한다. const nodeTest = () => { mnode.getFileFolderList(mnode.PATH); return; } 그러.. 2021. 7. 8. Node js, React 파일 관리 시스템 만들기 (3) 프로젝트 전체 링크 이전 - (2) fetch로 GET 요청하고 응답 받기 현재 - (3) 파일과 폴더 목록 불러오기 다음 - (4) 원하는 확장자의 파일만 불러오기 깃허브에서 코드 확인하기 어떤 게임회사에서 각 나라별로 게임을 출시했다고 하자. 그러면 그 게임에 대한 어떤 파일을 관리할 필요가 있다. React로 csv 편집기를 만들었으므로, csv 파일을 React/Node JS로 관리해보자. 먼저 관리할 파일은 ver 별로 나뉠 수 있다. 여기에서는 아래와 같이 연도별로 나뉜다. ver 별 폴더만 필요하고 나머지 파일은 불필요하지만 관리하다보면 쓸모없는 파일이 있을 수 있다. 연도별 파일은 아래와 같다. 연도별로 게임을 출시하는 나라가 다를 수 있다. 마찬가지로 불필요한 파일이 들어있을 수 있다. .. 2021. 7. 7. Node js, React 파일 관리 시스템 만들기 (2) 프로젝트 전체 링크 이전 - (1) Project Setting 현재 - (2) fetch로 GET 요청하고 응답 받기 다음 - (3) 파일과 폴더 목록 불러오기 깃허브에서 코드 확인하기 GET 방식으로 웹 서버에 데이터를 요청하고 응답받을 수 있다. 먼저 server/routes 폴더 아래에 nodetest.js를 추가한다. 현재 express를 이용해서 서버를 만들고 있다. express의 Router를 이용하면 code를 분리할 수 있다. React에서 요청이 오면 connect!!를 출력하고, 응답으로 result : success를 주는 코드다. //nodetest.js const express = require("express"); const router = express.Router(); r.. 2021. 7. 3. Node js, React 파일 관리 시스템 만들기 (1) 프로젝트 전체 링크 현재 - (1) Project Setting 다음 - (2) fetch로 GET 요청하고 응답 받기 깃허브에서 코드 확인하기 React Handsontable에 서버에서 파일을 불러오는 시스템을 만들어보자. 사용하는 node, npm ver은 아래와 같다. $ node -v v12.13.0 $ npm -v 6.12.0 handsontable-csv의 상위 폴더 React와 동일한 위치에 server 폴더를 만든다. server.js가 node의 main이다. 그리고 log를 관리할 폴더와 router를 관리할 폴더를 미리 만들어둔다. server.js에서 간단히 로그를 찍어보자. //server.js console.log("hello node js"); 실행시 출력되는 것을 알 수 있.. 2021. 7. 3. 이전 1 다음 반응형
