본문 바로가기

Programming

(40)
Vue.js의 객체 감시는 만악의 근원 Vue.js에서 배열이나 오브젝트의 v-for은 정말 짜증나는 관계가 아닐 수가 없습니다. Vue.js 2를 기준으로, 배열이나 오브젝트는 감시가 불가능합니다.그리고 이는 매우 더러운 코드를 양산하게 되는 이유가 됩니다. 배열이나 오브젝트의 감시를 위해서는 Vue.set(vm.$set) 또는 array.splice를 반드시 써야합니다.안 쓰면 감시가 안됩니다. 한마디로, v-for을 사용할 때, v-for의 데이터를 바꾸는 일이 생긴다면, 반드시 주의해야할 부분입니다. 단순히 this.oldValue = newValue;로는 절대로 리 랜더링이 되지 않습니다. 다행이도 Vue.js 3.0에는 객체 감시 시스템을 바꿔서 된다고는 하니, Vue.js 3.0을 기다리는 수 밖에 없습니다.
CSS에서의 vh와 vw vh : Viewport Heightvw : Viewport Width 예를 들어 화면을 꽉 채우고 싶을 때(Content의 넓이가 100%가 안되더라도) width: 100vw;height: 100vh; 로 하면 보이는 화면의 100%로 된다.즉 1vw와 1vh는 각각 가로 1%와 세로 1%이다.
심플한 로그인 및 회원가입 Vue.js와 HTML, CSS만을 이용해서 로그인 & 회원가입 화면.최근에 디자인 공부 열심히 하고있다.
유의적버전에 대해 정리한 프레젠테이션을 배포합니다. 안녕하세요. 생활코딩에 글을 올리는 것은 처음입니다.https://semver.org/lang/ko/ 를 정리해서 프레젠테이션으로 만들어 봤습니다.다만 약간 글자가 많아 번잡해 보입니다. 만드는데는 한 3시간 반정도 걸린듯 합니다. 많이 사용해주시면 감사드리겠습니다.깃허브를 통해 배포하고 있습니다. 또한 MIT 라이센스로 배포되지만 일부 제약 사항에 대해서는 맨 마지막 장을 참고하여주시기 바랍니다.아래 링크를 누르시면 바로 다운로드됩니다. PPT와 PDF 두 종류로 모두 제공합니다. https://github.com/Shin-Jae…/…/raw/master/develop/유의적버전.pptxhttps://github.com/Shin-JaeH…/…/raw/master/develop/유의적버전.pdf 유의적 ..
webpack-cli와 webpack-command의 차이(번역) https://github.com/webpack-contrib/webpack-command/blob/master/README.md의 Differences With webpack-cli 항목을 2018년 8월 3일에 번역하였습니다. 의역이 포함되어 있습니다.webpack-command는 webpack-cli와 동등성을 목표로 하지만, 주목할 만한 차이가 있습니다. 이러한 차이점에는 이 모듈에 webpack CLI를 제공하는 최소한의 명령만 포함되어 있다는 점이 포함됩니다. 초기 설정, 마이그레이션 및 업데이트와 같은 명령은 사용자가 설치한 개별 모듈로 이전됩니다. webpack-cli를 사용했었다면 아래와 같은 차이에 주의해야 합니다.--env 플래그는 사용할 수 없습니다. (The --env Flag i..
Express.js IP 구하기 Express.js에서 접속자의 IP를 반환하는 함수는 아래와 같다. const getIp = req => (req.headers['x-forwarded-for'] || req.connection.remoteAddress || req.socket.remoteAddress || req.connection.socket.remoteAddress); Express를 사용할 때 아래코드도 덤으로 넣어주어야 한다. "app.set('trust proxy', true);
robots.txt robots.txt는 웹 크롤러같은 로봇들의 접근을 제어하기 위한 규약이다. 한마디로 검색엔진봇이 접근하지 말아야하는 경로같은것을 의미한다.참고로 robots.txt는 권고사항임으로 지키지 않는 봇이 나타날 순 있다. robots.txt는 웹사이트의 루트경로에 있어야한다. (a.com/robots.txt)디텍토리의 뒤에는 반드시 /을 붙여야하는데, 아래와같이 사용할 수 있다.123456789101112User-agent: abcAllow: /abc/def/ User-agent: abcDisallow: /abc/def/ User-agent: *Allow: / User-agent: *Disallow: / cs첫번째는 User-agent가 abc인 봇이 /abc/def/에 접근하는것을 허용한다는 뜻이고,두번째..
간단한 express서버 만들기 12345678910111213const express = require('express'); //expressconst path = require('path');const app = express();app.use(express.static('public'));app.get('/',(req,res)=>{ //on GET (route : /) res.sendFile('./main.html');});app.get('/a',(req,res)=>{ //on GET (route : /a) res.sendFile('./a.html');});require('http').createServer(app).listen(7200,()=> { console.log("Server Start!");}); //Create htt..