본문 바로가기
반응형

분류 전체보기288

vue.js란? vue.js란? (pronounced /vjuː/, like view) vue.js란 한마디로 표현하면 "웹 화면 개발을 쉽고 빠르게 해주는 프레임워크"라고 할 수 있습니다. 좀 더 자세히 설명해보겠습니다. 뷰(Vue, 발음 /vjuː/, like view)는 웹 UI를 구축하기 위한 자바스크립트 프레임워크이다. 표준 HTML, CSS, 자바스크립트 위에 구축되며, UI를 효율적으로 개발할 수 있도록 돕는 선언형 및 컴포넌트 기반 프로그래밍 모델을 제공합니다. 예를 들어, vue의 예시코드로는 다음과 같습니다. import { createApp, ref } from 'vue' createApp({ setup() { return { count: ref(0) } } }).mount('#app') templa.. 2023. 11. 8.
개인 블로그 만들기를 위한 여정4 - 마크다운으로 글쓰기 hexo 에서 글을 써보자 hexo에서 글을 쓰기 위해서는 hexo 블로그가 위치한 폴더에서 아래 명령어를 수행합니다. hexo new post [title] 그러면 블로그경로/source/_posts/에 [title].md 라는 파일이 만들어지는데요, 이 파일에 내용을 아래와 같이 작성하면 됩니다. --- title: title categories: ["category"] tags: ["tag"] date: 2023-10-19 01:12:25 --- *Hello Hexo!* **Hello Hexo!** 아래 명령어로 서버를 실행한뒤, 브라우저로 접속하면 다음과 같은 화면이 나옵니다. hexo server 그런데, 문장의 앞뒤에 *을 입력했지만 표시되지 않았습니다. 표시되지 않고 해당 글자가 굵게 되거나.. 2023. 11. 7.
csv 파일 mysql/mariadb로 insert하기 요구사항 mariadb 설치 및 계정 필요 로그파일 준비 파일내용이 아래와 같이 생긴 test_log.log 파일을 예시로 준비하였습니다. "2023-03-10 18:13:10", "test", "search.html" "2023-03-12 18:13:10", "keyword test", "search.html" "2023-03-13 18:13:10", "keyword", "search.html" "2023-03-14 18:13:10", "test", "search.html" "2023-03-15 18:13:10", "keyword", "search.html" mysql에서 table 생성 create table stats_raw( created_time datetime, keyword varchar(1.. 2023. 11. 6.
개인 블로그 만들기를 위한 여정3 - hexo 글쓰기, 페이지 만들기, 미리보기 글쓰기 hexo 블로그를 생성한 폴더에서 아래 명령어를 실행해줍니다. hexo new post 기본적으로 scaffolds 폴더에는 post.md, page.md, draft.md라는 파일이 있는데요, 그 중 post.md파일의 내용을 복사하여 source/_posts폴더 하위에 제목.md파일을 만들어 붙여넣어도 됩니다. 아무튼, 저는 아래와 같이 명령어를 입력하였고, (hexo new post test) source/_posts/test.md라는 파일이 만들어 졌습니다. 그 다음에 글씨를 간단하게 써 보겠습니다. 글 내용은 --- 하단에 적으시면 됩니다. 아래 내용으로 입력해보겠습니다. Hello Hexo! 페이지 만들기 페이지 만들기도 비슷합니다. hexo new page 아래와 같이 about 페이.. 2023. 11. 2.
javascript로 form 태그 연속 submit 방지 코드, 중복 submit 방지 전체 코드 var isSubmit = false; function doubleSubmitCheck(form, e){ e.preventDefault(); if(isSubmit){ return false; }else{ form.submit(); isSubmit = true; return true; } } 설명 먼저, submit이벤트가 들어오면 preventDefault()로 form 태그의 기본 event를 중지시킵니다. (else부분 설명) submit을 하고, isSubmit 변수값을 true로 바꿔서 submit이 되었다고 체크합니다. (if부분 설명) 만일 submit이 한번 된 상태라면 submit을 따로 수행하지 않습니다. #Javascript https://devscb.com/post/191 .. 2023. 11. 1.
mariadb / mysql 신규계정생성 및 database 생성 계정생성 CREATE USER '[계정명]'@'[접속가능한ip]' IDENTIFIED BY '[패스워드]'; 아래는 예시입니다. CREATE USER 'test'@'localhost' IDENTIFIED BY 'test'; CREATE USER 'test'@'%' IDENTIFIED BY 'test'; database 생성 create database [db 이름]; 아래는 예시입니다. create database test_db; 아래는 만들어진 database가 정상적으로 잘 생성되었는지 모든 database를 보는 명령어입니다. show databases; 계정에 database 권한 추가 grant all privileges on [db 이름].* to '계정명'@'[접속가능한ip]' IDENTIF.. 2023. 10. 31.
개인 블로그 만들기를 위한 여정2 - hexo 시작하기 nodejs 설치 hexo를 시작하기전, nodejs 설치가 필요합니다. https://nodejs.org/ 를 들어가면 아래와 같이 바로 다운로드 할 수 있는 링크가 나옵니다. 개인적으로 최신버전보다는 LTS 버전을 사용하는 것을 선호합니다. LTS는 Long Term Support의 약자로, 장기간 해당 버전에 대한 지원을 해준다는 의미입니다. (지원이란 버그 수정등을 일컫습니다) 링크로 설치파일을 다운및 실행하고 next를 계속 누르면 설치가 완료됩니다. git 설치 git설치도 간편합니다. 아래 주소에서 설치파일을 다운및 실행하고 next를 계속 누르면 설치가 완료됩니다. https://git-scm.com/download/win hexo 설치 nodejs가 설치가 되면 이제 hexo를 설치할 수.. 2023. 10. 30.
윈도에서 방화벽 해제 여부 확인, 윈도우 포트 오픈 확인, powershll 포트 오픈 확인 윈도에서 방화벽 해제 여부 및 포트 오픈 여부 확인방식을 알려드립니다. 총 세가지 방식을 소개합니다. 1안) powershell 명령어 사용하는 방법 아래와 같이 powershell을 실행합니다. 아래 명령어 사용하여 포트 오픈 여부 확인 Test-NetConnection [아이피] -Port [포트] 성공시, 아래와 같은 화면이 뜹니다. (TcpTestSucceeded : True) 실패시 TcpTestSucceeded 값은 False로 뜹니다. 2안) tcping 프로그램 사용 https://www.elifulkerson.com/projects/tcping.php 접속 아래 link 혹은 사이트에서 tcping.exe 클릭하여 tcping.exe 다운로드 ( tcping 업로드 필요 //) tcpin.. 2023. 10. 27.
개인 블로그 만들기를 위한 여정1 - 블로그 플랫폼, static framework 배경 몇 년 전부터 개발 겸 일상 블로그를 티스토리에서 운영하였습니다. 그런데, 어느날 갑자기 티스토리에서 자신들의 구글광고를 내 블로그에 붙이겠다고 합니다. 이미 제 광고가 들어가 있는데, 글 상단에 떡하니 넣어서 가독성을 떨어뜰이기도 하고, 언젠가 카카오 데이터 센터에서 불이나서 블로그가 먹통된 사건도 있고 해서, 이 기회에 다른 블로그 플랫폼을 검토하게 되었습니다. 블로그 플랫폼 앞으로는 어떻게 블로그를 운영해야하나, 여러 블로그 운영 방식을 비교해보았습니다. 플랫폼 평가 티스토리 쉽고 간단하나, 카카오로 넘어오면서 불안한점이 많아보임(데이터센터 화재로인한 서비스정지, 광고정책등) 네이버 글 작성시 에디터가 느리고 클릭을 많이 해야함, 자유로운 커스터마이징 불가, 내 포스트가 검색순위권에 유지되기 .. 2023. 10. 26.
php 에서 named parameter sql 간단히 사용하기 php 에서 named parameter sql 사용하여 fetch를 간단히 할 수 있는 함수 입니다. /* example $dsn = 'mysql:host=localhost;dbname=mydatabase'; $username = 'myusername'; $password = 'mypassword'; $pdo = new PDO($dsn, $username, $password); $pdo->exec("set names utf8"); $sql = 'SELECT * FROM mytable WHERE name = :name AND age > :age'; $param = array("param1"=>"value1", "param2"=>"value2"); */ function named_query($sql, $p.. 2023. 10. 25.
mysql 백업 bash 스크립트 개요 제가 운영하는 서버에서 mysql db를 주기적으로 백업할필요가 있어서 아래와 같이 구상하였습니다. 계정별 DB백업 -> 90MB 분할 zip 파일로 생성 -> git repository로 복사 백업한 파일은 해당 서버가 위험해질 경우에도 사용할 수 있는 저장소가 필요했는데, 비용을 생각하여 github을 무료로 사용할 수 있겠다 싶어 선정하게 되었습니다. 그런데, 단일 파일의 크기가 100MB가 넘으면 push가 되지 않았기에 분할압축을 하였습니다. 또한, git repository도 안전하지 않을 수도 있으므로 암호화 하였습니다. 압축파일을 암호화하려면 linux 계열에서는 zip을 써야한다더군요. (다시 압축을 풀때 번거롭습니다.) 추가적으로, DB 인스턴스는 하나지만 백업해야할 db대상은 여.. 2023. 10. 24.
spring interceptor란, spring custom interceptor 라이브러리 만들기, spring custom interceptor 적용 spring interceptor란, spring boot custom interceptor 라이브러리 만들기, spring boot custom interceptor 적용 spring interceptor란? spring interceptor를 한마디로 정의하면 request를 가로채서 추가적인 로직을 수행할 수 있도록 하는 요소입니다. spring에서의 Interceptor가 있을때의 처리방식은 아래 그림과 같습니다. (Handler Interceptor 부분입니다) client에서 웹서버로 호출 dispatcher servlet을 통해 request를 Handler Interceptor로 넘김. Handler Interceptor의 Prehandle 메소드 로직수행후, Handler -> contr.. 2023. 10. 22.
반응형

티스토리툴바