개발35 ul, li 블릿,기호,점 스타일 변경 및 없애기 ul, li 스타일은 8가지가 있다. 또한 블릿이 필요없을 경우에는 블릿을 없앨 수 있다. 기본 스타일이라 별도의 스타일 지정 필요 없음 테두리만 있는 원형 ul{ list-style-type : circle; } 네모 모양 ul{ list-style-type : square; } 숫자 형식(1. 2. 3. ~) ul{ list-style-type : decimal; } 소문자 형식(a. b. c. ~) ul{ list-style-type : lower-alpha; } 대문자 형식(A. B. C. ~) ul{ list-style-type : upper-alpha; } 소문자 로마자 형식(i. ii. iii. ~) ul{ list-style-type : lower-roman; } 대문자 로마자 형식(I. .. 개발/CSS 2021. 1. 3. Font Awesome 사용하기 - css 아이콘 사용 Font Awesome은 다양한 아이콘을 간편하게 사용할 수 있는 라이브러리입니다. 약 1,600개의 무료 아이콘을 제공합니다.(유료는 약 8.000개) 사용법을 소개해 드립니다. 아래의 CSS 링크를 복사하여 사이에 삽입합니다. Font Awesome 사이트에 접속하여, 사용하고 싶은 아이콘을 검색합니다. fontawesome.com/icons 흐리게 표시되는 것은, 유료 전용 아이콘입니다. 사용할 아이콘을 선택합니다. 라고 쓰여 있는 1번을 누르면 소스코드 복사, 다운로드 아이콘이 그려진 2번을 누르면 SVG 파일로 다운받을 수 있습니다. 소스코드를 복사하여 원하는 곳에 붙여넣으면, 아이콘을 사용할 수 있습니다. Font Awesome Docs를 참고하면 다양한 사용법을 확인할 수 있습니다. 예제 몇.. 개발/CSS 2021. 1. 3. Nodejs 이메일 전송 구현(Nodemailer) Nodemailer 모듈을 사용하면 Nodejs에서 이메일 전송 기능을 구현할 수 있다. 우선 Nodemailer를 설치하자. npm i nodemailer Gmail을 사용하면 하루 500통의 메일까지 전송이 가능하다고 한다. 사용을 위해서는 설정이 필요하다. www.google.com/settings/security/lesssecureapps 위 주소로 접속하여, 보안 수준이 낮은 앱의 액세스를 허용해 준다. Node에서 메일 전송 기능을 구현한다. router/mail.js const express = require('express'); const router = express.Router(); const nodemailer = require('nodemailer'); router.post('/se.. 개발/Node.Js 2021. 1. 1. Node 자동재시작 Supervisor 설치 Node는 프로그램 수정 후 수동으로 재시작을 해야 반영이 된다. 이 점이 굉장히 귀찮은데 Supervisor를 설치하면 소스 수정 후 자동 재시작이 되어 매우 편리하다. Supervisor 설치 npm i supervisor -g package.json 파일을 열고, "start": "node ./bin/www" 을 다음과 같이 수정 "start": "supervisor ./bin/www" 수정 후 npm start로 node 실행 다음과 같이 나오면 성공적으로 적용된 것임. 개발/Node.Js 2020. 12. 31. node express bootstrap 프로젝트 만들기 express 설치 npm i express-generator -g express 프로젝트 생성 -e 옵션은 ejs를 사용하겠다는 뜻 express -e 프로젝트명 프로젝트로 이동 후 npm(Node Package Manager) & boorstrap 설치 npm i && npm i bootstrap --save app.js 파일을 연 후, bootstrap 경로 추가 app.use('/bootstrap', express.static(path.join(__dirname,"node_modules/bootstrap/dist"))); views/index.ejs 파일을 다음 내용으로 변경 Cover Home Features Contact Cover your page. Cover is a one-page tem.. 개발/Node.Js 2020. 12. 31. Vue Bootstrap 프로젝트 생성 Vue 설치 npm i vue Vue CLI 설치 Vue CLI는 Vue 개발 환경 설정 도구이며 프로젝트 세팅 및 Vue 명령어를 사용 가능하게 해 줌 npm i -g @vue/cli Vue 프로젝트 생성 vue init webpack bootvue 위의 명령어를 입력하면, 프로젝트 설정 질문 답변이 나옴 ? Project name bootvue ? Project description Bootstrap Vue Project ? Author jess ? Vue build standalone ? Install vue-router? Yes ? Use ESLint to lint your code? No ? Set up unit tests No ? Setup e2e tests with Nightwatch? No.. 개발/Vue 2020. 12. 31. MySQL ERD 수정 후 반영하기 ERD 수정 후 Database -> Synchronize Model 클릭 Continue를 하다 보면 Synchronized를 할 DB를 선택하라고 한다. DB 선택 후 Continue 수정내역이 표시됨. 확인 후 Continue 클릭 Execute 전 미리보기가 뜬다. 확인 후 편집할 내용은 편집한 다음 Execute 클릭 수정 완료. 실제 테이블에서 확인해 보면 반영이 잘 된 것을 확인 가능함. 개발/SQL 2020. 11. 5. GCP MySQL Timezone 변경 GCP에서 set global time_zone = 'Asia/Seoul'; 을 하면 아래와 같은 오류가 발생한다 Error Code: 1227. Access denied; you need (at least one of) the SUPER privilege(s) for this operation GCP의 MySQL은 GCP 내의 설정 수정으로 Timezone을 변경해 주어야 한다 Timezone을 수정하려는 SQL로 들어간 후, 수정 버튼을 클릭 플래그에 default_time_zone 추가 후 값을 +09:00로 넣어준 뒤 저장 저장 후 SQL이 재시작되고, 재시작 후에 설정이 적용된다. select @@global.time_zone,@@session.time_zone,@@system_time_zone.. 개발/GCP 2020. 10. 28. MySQL Timezone 확인 / 한국시간으로 변경 - 현재 시간/Timezone 확인 select @@global.time_zone,@@session.time_zone,@@system_time_zone,now() - SYSTEM / UTC로 되어 있는 Timezone을 Asia/Seoul로 변경 set time_zone='Asia/Seoul'; set global time_zone = 'Asia/Seoul'; 현재 시간으로 변경 완료 개발/SQL 2020. 10. 28. Node / Vue 현재시간 구하기 moment라는 모듈을 사용하면 node와 vue에서 시간 계산하기가 매우 편리하다. moment 설치 npm install moment --save 모듈 import node : var moment = require('moment'); vue : import moment from "moment" Vue.use(moment) let date = moment().format('YYYY-MM-DD HH:mm')console.log(date) //2020-10-28 11:11 UNIX Timestamp Milisecond -> moment().valueOf() //1603850894415 개발/Node.Js 2020. 10. 28. 인증서 만료일자 확인하기 1. 인증서가 들어있는 폴더로 이동 후 아래 명령어 입력 openssl x509 -enddate -noout -in 인증서파일명 위와 같이 인증서의 만료일자가 표시됨 2. 웹페이지에서 확인 웹사이트 주소 왼쪽의 자물쇠를 클릭한 후 인증서 버튼 클릭 해당 사이트의 인증서 정보가 표시됨 개발/Web 2020. 10. 28. 이전 1 2 3 다음 💲 추천 글