22일, udemy에서 프론트엔드 개발자 성장 가이드 세션을 들었다. 내가 듣고 있는 부트캠프는 풀스택 과정이고(한마디로 다 배운다는 뜻) 지금 프론트엔드를 배우고 있기 때문에 신청하게 되었다. 그리고 사실 다 떠나서 성장 가이드가 내겐 정말 필요하기 때문에 고민할 이유가 없었다. udemy에서 강의를 하고 있는 두 개발자분(Poco Jang, Maker Jun)의 진솔한 생각을 들을 수 있었다. 첫번째 순서는 Poco Jang, 두번째 순서는 Maker Jun님으로 나뉘어 진행되었다. 내용 중 회고의 중요성도 있었기에 생각에 남는 내용 중심으로 회고해보려고 한다ㅎ 1. 공부할 때 완독/완강이 아닌 인풋, 아웃풋이 핑퐁이 되는 방식으로 하기 예를 들면, 자바스크립트의 무한 스크롤을 만드려면 a, b 기능..
해당 부서의 상세 정보 모달 출력 상세정보 모달에서 항목 수정 후 ok 버튼 클릭 -> 업데이트 API 호출 모달은 닫히고 업데이트 후 결과에 따라 안내 메세지 출력 및 리스트 재검색 부서 정보 초기화 const stateInit = { Department: { id: null, name: null, code: null, description: null, createdAt: null, updatedAt: null } } //부서정보 초기화 actDepartmentInit(context, payload) { context.commit('setDepartment', { ...stateInit.Department }) //stateInit.Department = null } 전개연산자 actDepartment..
어제 해본 socketio로 간단한 채팅창 구현 간단히 복습했다. * port를 따로 뺀 이유 : 환경 변수 * const ~ require ~ = inport ~ from ~ I18n 다국어 처리 가능 처음 개발할 때 도입하지 않으면 나중에 절대 못바꾼다. json으로도 가능 vueproject eslint prettier, bootstrap vue, css 설정 페이지 분할 : header, Sidebar, Content 세 부분으로 * Lorem : 의미없는 문구 생성 * router/index.js 파일 설정 import Vue from 'vue' import VueRouter from 'vue-router' import Home from '../views/Home.vue' Vue.use(VueR..
업무용 자아를 분리하여 창작물(코드)에 대한 평을 스스로에게까지 끌어오지 말자. 다만 코드가 계속 만족스럽지 못한 평을 받는다면 능력을 객관적으로 평가해볼 필요가 있다. 기능부터 공부하고 스타일은 그 다음이다. 쓸데없는 코드는 빼고 최소한의 코드로 간결하게 작성하는 게 좋은 코드! 줄맞추기/들여쓰기는 디버깅을 위해 정말 중요! name/value 값으로 한글 no -> DB에 들어갈 때 코드로 들어가기 때문 코드를 계속 쳐서 손이 익숙해지게 해야함!! 속성 공부할 때 중요한 점 : 이게 필수인지 아닌지 var/const/let -> var는 쓰지말고, 일단 무조건 const, but 밑에서 값이 변경되면 let component 요소 부분부분 나누기 (매우 중요!) - header component - ..
오늘은 vue.js를 시작했다. 기억하고 싶은 내용은 *로 구분했다. vue.js 설치 vue.js의 버전은 안정화된 2.x로 했다. 3.x까지 나오긴 했는데 호환성에서 아직 부족하다. 새로 프로그램이 나온다고 무조건 좋은 게 아니고 다른 사람들이 검증한 뒤 탑승해도 늦지 않다! node랑 npm은 버전을 따로 확인하는 게 좋다. npm은 node를 설치하면 같이 설치된다. 이건 이미 예전에 깔아놨다.(nvm 이용 : 버전이 자주 업뎃되는 node.js의 버전을 변경하면서 개발 가능하기 때문) 더보기 nvm 설치부터 한다. Releases · coreybutler/nvm-windows A node.js version management utility for Windows. Ironically writte..
유념사항 혼자 vi 편집기 공부 Docker 공부 WSL 사용 X(의미 없음) 개발 공부 정리 시 markdown 유용(stackedit으로 html 파일로 작성 가능) 오늘은 html을 배웠다. html은 오류를 띄우지 않고 그냥 안하거나 제멋대로 작동하니 주의해야한다. 구성요소 - 태그(tag) 모든 태그는 "시작태그", "종료태그"로 구성된다.(예외:hr, br 등) - 요소(element) 실제 화면에 출력되는 텍스트 부분, 태그 사이에 있다. - 속성(attribute) 태그의 속성을 부여한다. (형태, 색 등) 여러 속성이 존재할 수 있다. 띄어쓰기로 구분한다. - 값(value) 속성에 할당되는 값을 나타낸다. 문자는 따옴표""로 감싸서 표시, 숫자는 그냥 표시한다. 숫자도 써도 되는데 차이..
오늘 배운 것 - 쿠키 더보기 const http = require('http') const server = http.createServer((req, res) => { console.log(req.url, req.headers.cookie) res.writeHead(200, { 'Set-Cookie': 'mycookie=test' }) res.end('cookie example') }) server.listen(3000) server.on('listening', () => { console.log('3000번 포트에서 쿠키 서버 실행 중') }) server.on('error', err => { console.error(err) } ) - 세션 - 패키지매니저 -npm - express, morgan,..
실습은 TIL로 기록해야겠다ㅎㅎ 어떤 식으로 써야할지 고민이 많았는데 그냥 '쓰고 싶은 대로 써야 오래 쓴다'는 진리 같은 한문장을 보고 쓰고 싶은 대로 쓰기로 했다. 오늘은 http 모듈로 서버를 만들었다. check 할 사항 - VSC에서 js코드 수정 후 꼭 ctrl+c로 껐다 켜야함 - return res.end(data) 꼭! 잊지 말아야한다. res.end 호출 앞에 return을 붙이지 않으면 함수가 종료되지 않는다. 더보기 const http = require('http') const fs = require('fs').promises const users = {} //데이터 저장용 const server = http.createServer(async (req, res) => { try { ..
