일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 | 31 |
- Git
- 뷰
- AWS
- react
- 플러그인
- PWA
- 프론트
- javascript
- plugin
- vue login
- 셋팅
- 토이프로젝트
- nginx
- extension
- 배포
- Firebase
- login
- jwt
- react-query
- 신상마켓
- Docker
- vue
- 정리
- vsCode
- 로그인
- 기획
- express
- vuex
- 회고록
- database
- Today
- Total
목록전체 글 보기 (105)
강디너의 개발 일지
준비물 Front-end 파일 (빌드된것) Back-end 파일 AWS Nginx 까지 띄운 것 Putty (원격접속) 환경 Window 10 1. Front-end Build 빌드가 끝난 후 dist 폴더가 만들어졌는지 확인해주세요 2. 압축도 해줍니다. 3. 자신의 EC2 에 파일을 전송합니다. pscp -i C:\path\my-key-pair.ppk C:\path\Sample_file.txt ec2-user@public_dns:/home/ec2-user/Sample_file.txt 참조 : https://docs.aws.amazon.com/ko_kr/AWSEC2/latest/UserGuide/putty.html 4. 확인하기 ! 5. 압축 해제 unzip vue-project.zip (사진은 생략)..
AWS EC2에서 Nginx 를 설치해서 웹서버를 띄워보겠습니다. 1. AWS 가입... 인증 1달라...! 2. https://aws.amazon.com/ko/getting-started/tutorials/launch-a-virtual-machine/ 에서 학습하면서 인스턴스 만들기 ! - 인스턴스 만들면 기본적인 리눅스가 뜹니다 ! 3. ssh ~~~~ 어쩌구 저쩌구로 로그인합니다 로그인 완료 이제 본격적인 시작입니다.sudo yum 을 업데이트 해달라고 하니.. 업데이트 한번 해주시고 (안해도 상관없음) sudo yum install nginx설치하다가 중간에 물어보는게 있는데 y 누르시면 됩니다. 설치가 완료 되셨으면 sudo service nginx start 를 하시면 ! 짠 ! 하지만 끝이 ..
Firebase 이용해서 Hosting, Database 사용하기 ! https://translator-c4119.firebaseapp.com/ Vscode 플러그인에서 데이터를 받은지... 한달 ?하지만 데이터가 많이 쌓이지 않는다... 테스트 할때 보니 170개 가량... 쥬륵 만들었던 과정을 끄적끄적 해보겠습니다. 우선가이드 - https://firebase.google.com/docs/hosting/quickstart?authuser=0 요약하자면node 를 설치하고 firebase-tools 를 설치하고 firebase login 하고 firebase init 으로 시작합니다. 그리고 firebase deploy 를 하면 배포가 됩니다. - 끝... 호스팅은 생각보다 쉽습니다. (데이터베이스 연..
프론트부터 배포까지 기획_v5 1. AWS 가입2. AWS 에 Linux 셋팅3. Nginx 설치4. vue, express 셋팅5. docker 설치6. docker 이미지 만든거 불러오기 (도커허브에 올려야겠다 미리) 7. 다 연동시키기 8. jenkins 셋팅?
프론트부터 배포까지 기획_v4 v_4 jenkins 이용해서 자동화 배포 하고 싶다.. AWS 를 셋팅을 먼저 하고, 배포를 한번 하고, 자동화 배포를 하는게 순서인지 앞으로 더 찾아보려고 한다.
번역기 플러그인을 만들고... vscode 를 쓰는 사람들은 대부분 ? 개발자니깐... 어떤 영어를 번역하는지 보고싶었다. 보려면 DB가 필요한데... 항상 켜져있어야하고... 흐음.. 하다가 찾은게 파이어베이스 !vscode 가 electron 기반이라고 듣고 electron 은 node 기반이니깐 firebase node 쪽을 써보면 되겠다 ! 싶어서 개발 착수 ...! 가이드를 보며 열심히 따라 했다. node 쪽은 admin(관리자) 로 개발 해야하며, 가이드가 너무 잘나와있어서 막 오랜시간 삽질을 안했다. 여기서 serviceAccount 는 구글에서 json 파일을 준다. 그곳에 API 키라든지 토큰이라든지 등등.. 중요한건 다들어가있다. db에 translate 라는 큰 가지를 만들고그 아래..
준비물 1. express 서버 키기 2. mysql 서버 키기 3. Vue 서버 키기 *설치 모듈* 서버와 통신하기 위한 axios 설치 상태 관리를 위한 Vuex 설치 Login 기능 만들기 + 인증 1. axios를 main.js 에 넣어서 전역으로 쓸수 있게 합니다. 2. 로그인을 해봅시다. loginSubmit: function() { console.log("로그인"); this.$Axios.post(`http://127.0.0.1:3000/auth/login`, { id: this.user_id, pwd: this.user_pwd}).then( res=> { console.log(res); this.$router.push("/"); } ) }, 리턴값이 이쁘게 나오는 것을 볼 수 있습니다. 3..
JWT 으로 로그인 인증을 하겠습니다. 우선 jsonwebtoekn 모듈을 다운받겠습니다. 이 모듈은 jwt를 편하게 만들수 있도록 도와줍니다. JWT 로그인 1. user 테이블에서 user_pwd를 가져온 뒤 2. hash 해서 hash 한 값과 가져온 값과 비교 하고 맞으면 3. Token 을 만듭니다. 토큰이 성공적으로 만들어지면 성공 메시지와 함께 토큰을 보내줍니다. app.post('/auth/login', (req, res) => { // 로그인 인증 User.user_id = req.body.id; User.user_pwd = req.body.pwd; let jwt_secret = 'DinnerKang'; console.log(req.body.id); if (User.user_id) { c..
CRUD 중 R은 전 시간에 했고, C 와 D 를 해보겠습니다. CreateReadUpdateDelete *준비물*Insonomia 1. 모델을 정의해줍니다. User로 정의했습니다. class User { constructor(user_id, user_pwd, user_role){ this.user_id = user_id; this.user_pwd = user_pwd; this.user_role = user_role; }} 2. 비밀번호 암호화 Node 에는 crypto 라는 내장 모듈이 있습니다. 우선 config 에 KEY를 하나 추가해줍니다. 그 후 crypto와 secret 을 선언해줍니다. 테스트 해보겠습니다. 암호화가 잘 되는것을 볼수 있습니다. 3. 사용자 등록 사용자 등록 쿼리이름, 비밀..
프로젝트_4 Express API 개발 *준비물*insomnia REST API 테스트 툴 1. body-parser, mysql, cors 설치 npm install --save body-parser npm install --save mysql npm install --save cors 2. body-parser, mysql, cors 변수 입력 3. mysql 설정 파일 및 Model 만들기 models 라는 폴더 -> user -> user.js 파일 만든 후 User 모델을 만듭니다. config.js 라는 파일도 만들고 본인 MySQL의 정보를 적습니다. 4. DB 설정 입력 아까 만든 config를 잘 연결시켜줍니다. 5. 테스트 하기위한 사용자 전체 조회 API만들어 봅니다. 아 그러기 위해..