목록모든 글 (126)
코딩쌀롱
✘✘✘ 문제 발생 코드 ✱ 익스프레스 서버 app.js const express = require('express'); const app = express(); // 생략.. const indexRouter = require('./routes/index.js') const itemsRouter = require('./routes/item-list.js') app.get('/', indexRouter) app.get('/item-list', itemsRouter) //생략.. ✱ itemsRouter 라우터 객체를 exports하는 routes/item-list.js const express = require('express'); const router = express.Router(); const ite..
✱ class 예시 코드 // Car 부모 클래스 class Car { constructor(brand) { this.carname = brand; } present () { return `I have a ${this.carname}` } } // Car를 상속받는 Model 클래스 class Model extends Car{ constructor(brand, mod) { super(brand) this.model = mod; } show () { return this.present() + `, It is a ${this.model}` } } const mycar = new Model('Ford', 'Mustang'); mycar.show() //"I have a Ford, It is a Mustang"..
✱ pipe 함수 const pipe = function() { let fns = [...arguments]; return function(arg) { return fns.reduce((arg, fn) => fn(arg), arg); } } pipe함수를 위처럼 작성했었는데 화살표함수로 표현해보라는 리뷰를 받아 수정했다. const pipe = (...fns) => arg => fns.reduce((arg, fn) => fn(arg),arg) 이렇게나 코드가 간단해졌다!!! 화살표함수에는 elements 객체가 없어서 어떻게 인자들을 받아와야할까 했는데 디코에게 rest parameter 힌트를 얻었다. 그래서 여기에 커링을 한 스푼 더해 화살표함수로 pipe함수를 만들 수 있었다. 오늘 제일 뿌듯했던 ..
✱ES Modules export default 할 때는 넘기는 게 딱 하나일 때 export default ref; import ref from './ref.js' 넘기는 게 여러 개 라면 export { ~, ~, ...} export { a, b, c } import { a, b, c } from './ref.js' 넘기는 게 여러 개이고, 받을 때 한 변수에 담아서 받고 싶다면 export { a, b, c, d, e, f } import * as elements from './ref.js' ✱ 배열에 비동기 작업 처리 배열을 가지고 〔원소1 처리 - (1초 뒤에) - 원소2 처리 - (1초 뒤에) - 원소3 처리 .... 〕이렇게 해보려는데 방법을 모르겠어서 구글링을 했다. forEach는 순..
✱ 10진수 → 16진수 const dec = 65; const hex = dec.toString(16); // "41" dec값은 number, 반환값은 string ✱ 16진수 → 10진수 const hex = '4E'; const dec = parseInt(hex, 16); // 78 hex값은 영어 대소문자 상관없고, string도 가능하고 number도 가능하다. (알파벳 포함 16진수라면 당연 문자열로) 반환값은 number ✱ 10진수 → 아스키코드 문자 String.fromCharCode(65, 66, 67); // "ABC" String.fromCharCode(69, 118, 101); // "Eve" String 개체의 메서드인 fromCharCode에 10진수를 인자로 주면 아스키코드..
✱HTML 파일 email: ajaxsend ✱JS 파일 // ajaxsend 버튼 이벤트 등록 document.querySelector('.ajaxsend').addEventListener('click', function() { const inputdata = document.forms[0].elements[0].value; sendAjax('http://127.0.0.1:3000/ajax_send_email', inputdata); }) // 이벤트 핸들러 function sendAjax(url, data) { const data = {'email': data}; data = JSON.stringify(data); const xhr = new XMLHttpRequest(); xhr.open('POST..
const express = require('express') const app = express() app.listen(3000, function() { console.log('start! express server on port 3000); } ✘ app.listen(3000, 함수) 3000포트를 기반으로 함수 실행, 대기 중인 상태로 머물러있음 localhost:3000은 127.0.0.1:3000과 같다. // (1) app.get('/', function(req, res) { res.send("codingSalon") }) // (2) app.get('/', function(req, res) { res.sendFile(__dirname + "public/main.html") }) ✘ app.g..
2월에 회고를 잘 안 쓰게 됐는데..이유는 너무 망가졌어서 회피했던 것 같다. 조금 더 회복해서 사이클을 다시 찾게되면 그 때 회고를 작성해야지 했는데 쉽게 변하지 않아 이번에 쓰게 됐다. 바로 이전 회고에서는 굉장히 야심찼던 것 같은데 부끄럽다ㅎㅎㅎ ✘✘✘ 문제들 1. 넷플릭스, 유튜브 넷플릭스 시리즈 중에 하나를 우연히 봤다가는 큰일난다. 나는 특히나 한 번 시작하면 새벽까지 못 끊고 보기 때문에 시작하면 안 된다. 그래서 핸드폰에 유튜브와 함께 넷플릭스 어플을 삭제했다. 심심하단 생각이 들면 다시 설치할까라는 충동이 들기도 하지만 아직 다시 설치하지 않았다. 깔면 안 된다🤙🏼 2. 늦잠 이건 내 인생 과제다. 아침에 일찍 못 일어 나는 거. 이제부터 잠에 드는 시간을 정해놓고 꼭 지켜야겠다. 목표는..
✱ translate() 원래의 위치를 기준으로 이동하고, 원래의 위치 정보는 남아있다. 값을 하나만 넣으면 x축 이동, y축은 그대로(이동X) position translate 해당 요소의 컨테이너를 기준으로 해당 요소의 본래 위치를 기준으로 absolute의 경우 레이아웃의 다른 요소들과 완전히 별개의 존재가 되어 영향을 미치지 않음 본래 차지하고 있던 공간을 그대로 유지 주로 레이아웃을 짤 때 주로 hover, active와 같은 트리거 이벤트에 top, left는 각 프레임을 그려내는 데 너무 많은 시간을 소요한다. 그 결과 약간 뚝뚝 끊어지는 듯이 전이가 이루어진다. 반면에 translate는 요소가 GPU(RenderLayer)상에서 자기 자신의 레이어 위에 놓여지도록 만든다. GPU 상에서 ..
하루종일 express랑 싸웠다😠👊🏼👊🏼👊🏼 1. html을 ejs로 변경 html은 정적인 언어로 주어진 기능만 사용할 수 있고, 사용자가 기능을 직접 추가할 수 없다.(js로는 가능) 템플릿 엔진은 자바스크립트를 사용해서 html을 렌더링할 수 있게 한다. 기존 html 문법과 다를 수도 있고, js 문법이 들어있기도 하다. 대표적인 템플릿 엔진으로는 퍼그(제이드), 넌적스, ejs가 있다. 1) 데이터가 들어있는 json 파일에서 데이터를 불러와 동적으로 페이지를 구성하기 위해서 ejs로 파일을 바꾸었다. 먼저 ejs를 npm에서 설치했다. npm i ejs 2) 파일 확장자명을 ejs로 변경해줬다. index.html → index.ejs 3) app.js 파일 수정 app.set('view en..