일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | |
7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 | 30 |
- nginx
- PWA
- Docker
- javascript
- 배포
- 정리
- 회고록
- plugin
- extension
- 플러그인
- 프론트
- 로그인
- 기획
- vsCode
- vue login
- 토이프로젝트
- 신상마켓
- express
- react-query
- react
- vue
- Git
- Firebase
- vuex
- 뷰
- AWS
- jwt
- login
- database
- 셋팅
- Today
- Total
강디너의 개발 일지
*준비물* Docker (Kitematic 포함), mysql workbench 1. 도커를 설치합니다..window 10 pro 버전이 아닐경우 잘 찾으셔서 다운 받으셔야 합니다. 2. docker 터미널에서 mysql을 찾아봅니다. docker search mysql OFFICIAL 항목에 OK 라고 표시되어있으면 공식이미지라는 뜻 입니다.그중 저는 mysql 을 다운받겠습니다. 2. mysql 내려 받기 docker pull mysql 3. mysql 이미지를 컨테이너로 만들어봅시다. docker run 에 대한 환경 변수 참고 사이트 - http://pyrasis.com/book/DockerForTheReallyImpatient/Chapter20/28 호스트의 3306포트와 컨테이너의 3306 포..
1. app.js 를 만들고 터미널에 npm init을 해줍니다. 2. npm init은 node package manager를 시작하는것입니다. *주의사항*entry point에 app.js 를 확인해주세요이건 app.js 라고 만들었기 때문입니다.나머지는 무시하셔도 됩니다. 3. package.json 이 잘 만들었는지 보시고scripts 부분에start : node app.js 를 쳐주세요이 의미는 npm start 명령어를 쳤을때 서버가 시작되게합니다. 4. express 를 설치해줍니다. 5. 우선 세팅을 여기까지 하겠습니다 !
Vue 로그인 페이지를 만들어보겠습니다. style 을 scss 를 사용하기 위해서 필요한 모듈인 sass-loader 를 설치해야합니다. npm install --save sass-loader 설치하면 scss를 컴파일 할 수 있습니다. 구조는 다음과 같이 만들겁니다. Templete 로그인 회원가입 로그인 회원가입 Admin User 취소 회원가입 템플릿에서 보실점은 form 에 v-on:submit.prevent="loginSubmit" 입니다. form 안에있는 button type="submit" 인 버튼을 누르면 loginSubmit 함수를 실행하라는 의미입니다. user_id와 user_pwd는 v-model로 설정해주어 나중에 로그인할 때 사용할 것입니다. v-if 로 회원가입버튼을 누르면..
프론트부터 배포까지 기획_v3 v_3 로그인은 JWT( JSON Web Token) 으로 회원 인증 구현 express는 docker의 mysql에 접근
Vue 2+ 와 Git 설치를 해보겠습니다. Vue 2+ 는 Vue 버전 2.~~ 입니다. 현재는 Vue 3 이 나왔으나 자료가 부족해서 이번 프로젝트에서는 사용하지 않습니다. Vue 를 설치하겠습니다. 윈도우 -> cmd 창맥 -> 터미널 창 npm install -g vue-cli -g 옵션은 vue-cli 를 어디서든지 사용하겠다고 정의하는 옵션입니다. vue init 옵션에 대해서 보겠습니다. Browserify - Browserify + vue 조합으로 hot-reload, ESLint, unit testing 지원 템플릿 Browerify-simple - Browserify + vue 조합 pwa - 프로그래시브 웹을 만들기 위한 세팅 simple - 하나의 index.html 생성 webpa..