App.js 에서 사용되는 html 문법은 사실 JSX 임 -JSX = .js 파일에서 쓰는 html 대대품 react 에서 html 내용은 return ( 여기 안에만 작성 가능 ) JSX 문법 정리 1. CSS Class 명 설정 class 대신 className 2. 변수 넣을 때는 {중괄호} {/* document.querySelector('h4').innerHTML = post; js 기본 문법 */} id = {post} 데이터 바인딩 = 원하는 곳에 데이터 꽂을 수 있음 3.style 넣을 때 object 형으로 중괄호 안에 넣어줘야 함 //이렇게 쓰면 안댐 style = "color : red " 주의 : font-size 안됨 = js 이기때문에 - 기호가 안되서 fontSize 같이 다..
전체 글
F1 > settings.json (user) > "emmet.syntaxProfiles": { "javascript": "jsx" }, "emmet.includeLanguages": { "javascript": "html" }
1. npm 안됨 VS Code - powershell 터미널 말고 - Command Prompt 환경변수 / 시스템변수 Path 에 아래 경로 추가 C:\Users\니 컴퓨터 이름\AppData\Roaming\npm\ 2. create-react-app 안됨 Unknown command: "create-react-app 콘솔창에 아래 두 줄 순서대로 치고 해보셈 npm config set prefix /usr/local npm install -g create-react-app
조회 페이지 만들기 각각의 고유 게시글 조회 페이지 만들기 - 모든 각 페이지의 get 요청 처리를 만들 순 없다 (비효율적) - 따라서 url 에 id 등을 파라미터로 붙여서 재사용한다 /: 원하는 파라미터 : url 파라미터 만들기 req.params.id 요청 데이터의 파리미터 중의 id 값 // 상세페이지 만들기 + 게시글번호 app.get('/detail/:id', (req, res) => { db.collection('post').findOne({_id : parseInt(req.params.id)}, (err, result)=> { console.log(result) res.render('detail.ejs', { data : result }) }) }) --- html 상세페이지 title..
sendFile : sendFile은 어떤 파일을 그대로 보내고 싶을 때 app.get('/', function (req, res) { res.sendFile(__dirname + '/index.html') }) render render 는 파일을 보내기 전에 ejs 파일을 html로 바꾸고 싶을 때 (브라우저는 ejs 인식 못함 ) app.get('/detail', (req, res) => { res.render('detail.ejs', { name : result }) })
삭제 요청하기 - form 메소드에서는 get, post 만 가능 삭제는 어떻게..? 1. method-override 라이브러리 이용 2. JavaScript AJAX 이용 *AJAX 란? — LLAT (tistory.com) 기초 더보기 ajax 를 사용해 delete 요청 보내는 방법 서버에서 AJAX 삭제 요청 받아서 수행하는 방법 (아래 방법은 그냥 새로고침 할 떄마다 삭제됨, 아이디가 1인게 ) app.delete('/delete', (req, res) => { // 요청시 함께 보낸 데이터를 찾고 싶다 // 요청이 게시물 번호였으므로 게시물 번호 나옴 console.log(req.body); // 주의! 나는 분명 int 형 으로 보냈으나 수신은 string 형으로 된다 = 삭제안됨 // i..