성공을 즐기자

이전 글에서 이어서 시작합니다...!  vite를 이용한 프로젝트 만들기를 진행했었습니다. 그래서 local 띄우는것까지 완료!  이제 counter 프로그램을 만들기 위한 컴포넌트들을 만들어 볼까용? 1. 컴포넌트 폴더를 src 폴더 밑에 만들어주세요 그리구 이름은 Viewer.jsx 입니다.  사진에는 없지만 Counter.jsx 도 만들어줍니다.    아차...차 컴포넌트 첫번째 글자는 대문자로 해야하는거 아시져 ?  2. 간단하게 viewer  만들기   이렇게 하고 App.jsx 에서 로 넣어주면 ~  4.  Viewer 컴포넌트 확인 확인이 잘 되시죠?  5.  APP에서 Viewer, Controller 컴포넌트 호출 ! css 적용 하나 없이 그냥 쌩 button, h1 을 이용해서 만들..

일단 결과 화면 -! DB에 있는 데이터들이 화면에 잘 보이는 것을 확인 할 수있다. 파일 구성 : 1. server.js에서 길 지정하기 const board = require('./routes/board'); const PORT = 4000; // board 처리는 './routes/board'에서 처리 app.use('/board', board); // server port 4000 할당 // 클라이언트와 다른 번호로 충돌나지 않도록 app.listen(PORT, () => { console.log(`Server run : http://localhost:${PORT}/`) }) app.use를 이용해서 uri에 /board가 있다면 board라고 지정된 const, 즉 /routes/board에서 ..

0. 파일 구조 1. DB 설정 1-1. mysql DB를 만든 후 권한설정을 한다. 첫번째 빨간색에는 user이름이 두번째 빨간색에는 비밀번호가 들어간다. 1-2. 사용할 데이터들을 DB에 insert한다. 2. config -> db.js 수정 const mysql = require('mysql'); const db = mysql.createPool({ host : '[host]', user : '[유저 이름 ]', password : '[비밀번호]', database : '[DB 이름]' }); module.exports = db; 만든 DB에 접속할 수 있도록 config에 db파일을 만들어준다. 3. server.js 수정 const express = require('express'); cons..

1. server 디렉토리 안에 config와 routes디렉토리, server.js 를 만든다. 2. server.js const express = require('express'); const app = express(); const api = require('./routes/index'); // api 처리는 './routes/index'에서 일괄처리 app.use('/api', api); // server port 4000 할당 // 클라이언트와 다른 번호로 충돌나지 않도록 const PORT = 4000; app.listen(PORT, () => { console.log(`Server run : http://localhost:${PORT}/`) }) 3. Proxy ; 이를 위해서 package..