My Web Story

IT/Spring

[Springboot] 프로젝트 생성하기

1. File > New > Project 2. Sprng Initializr 선택 후 원하는데로 설정 3. 스프링부트 버전 선택 4. Web > Spring Web 선택 5. 프로젝트 생성 테스트 5-1. src > java > Controller 폴더 생성 후 > ApiController class파일 생성 5-2. ApiController 위에 @RestController 어노테이션 작성 5-3. ApiController 위에 @RequestMapping("/api") : URL을 지정해주는 어노테이션 작성 5-4 hello() 메서드 작성 @getMapping("/hello") 메서드 get(url값) 어노테이션 5-5 실행 (ctl + shift + f10) or (shift + f10) 6. ..

IT/etc

[채널톡플러그인] 채널톡 사용법

// vue 사용시 created // React 사용시 Mounting if (process.browser) { window.addEventListener("session_connect",function(e){ this.session_connect(e.detail); }.bind(this)); if ((typeof (window.androidinterface) != 'undefined') || (typeof (webkit) != 'undefined' && typeof (webkit.messageHandlers) != 'undefined' && typeof (webkit.messageHandlers.iOSinterface) != 'undefined')) { }else{ window.onload = (fu..

IT/VUE

[VUE.JS] 페이징 처리 컴포넌트

FRONT (pagenation.vue) mdi-chevron-left {{pageNum}} mdi-chevron-right BACK(getTestPagination API) with MySQL async getTestPagination(req, res) { console.log("getTestPagination API") let { type, limit, offset } = req.query let com_id = req.session.comInfo.com_id // 보여지는 갯수 만큼 곱하기 if (offset > 0) { offset *= limit } try { let sql = ` SELECT a.idx, a.title, a.content, a.regdate, al.total_count tota..

IT/JavaScript

[JAVASCRIPT] 자식컴포넌트에서 부모로 사용시 뒤로가기

부모의 자식컴포넌트에서 뒤로가기 시 아래 코드를 사용하면 부모로 이동 가능

IT/node.js

[Node.js] Nodejs 백엔드 프로젝트 생성하기 4(axios를 통해 front back 연결)

1-1 back에서 app.js 설정 const express = require("express"); const app = express(); //요청에서온걸 파싱 app.use(express.json({ limit: '300mb' })) //(http)form을 통해서 전송할때 req.body에 넣어준다 app.use(express.urlencoded({ limit: '300mb', parameterLimit: 100000, extended: true })) app.post('/user', (req,res) => { console.log("user API") let {nickname,email,password} = req.body }) 1-2. 자신이 사용하고자 하는 곳에 this.$axios.('ur..

IT/node.js

[Node.js] Nodejs 백엔드 프로젝트 생성하기 3 (with nodemon)

1. 백엔드 수정 후 서버를 껏다 켜지않으면 수정적용된것을 확인 할 수 없음 그래서 nodemon을 설치 ** nodemon : 서버를 껏다 켜지않아도 새로고침 후 수정 적용된것을 볼 수 있도록 해줌 D:\codingSeo\vue\back>npm i -D nodemon added 112 packages, and audited 271 packages in 4s 19 packages are looking for funding run `npm fund` for details found 0 vulnerabilities 2. package.json에서 scripts의 dev: "node app.js"를 "nodemon app.js"으로 고침 3. 설치 후 서버를 껏다가 켜게되면 nodemon이 작동 > nodem..

IT/node.js

[Node.js] Nodejs 백엔드 프로젝트 생성하기 2(with Sequelize)

1. 디비세팅 1-1 시퀄라이즈를 이용한 데이베이스 설치 터미널에 npm i sequelize mysql2 로 설치 **sequelize를 사용하면 자바스크립트로 sql을 사용가능함 **sequelize장점은 디비 종류에 상관없이 사용가능 ** mysql2는 node랑 mysql을 연결해주는 툴 (mysql이 아니다.) D:\codingSeo\vue\back>npm i sequelize mysql2 added 31 packages, and audited 82 packages in 5s found 0 vulnerabilities 1-2. 터미널에 npm i -D sequelize-cli 를 입력하여 sequelize-cli를 설치(개발모드로 설치) 글로벌로 설치하면 pakage.json의 devDepend..

IT/node.js

[Node.js] Nodejs 백엔드 프로젝트 생성하기 1

1. 백엔트 프로젝트 폴더생성 - back 2. npm init 하면 아래같이 설정에대한 내용이 나옴니다. : 나중에 설정가능한것들이 있어 그냥 엔터 후 yes 하시면 됩니다. D:\codingSeo\vue>cd back D:\codingSeo\vue\back>npm init This utility will walk you through creating a package.json file. It only covers the most common items, and tries to guess sensible defaults. See `npm help init` for definitive documentation on these fields and exactly what they do. Use `npm in..