All Projects

Vanilla Javascript로 구현된 부분 Typescript로 마이그레이션 하기

Jest 테스트 케이스 작성

router 모듈화하기

Vanilla Javascript와 History API를 활용하여 SPA 구현 세팅을 해보기

리눅스 우분투 서버에 젠킨스 설치하기

젠킨스 사용을 위한 리액트 + Webpack 번들링 세팅해두기

delete api와 mysql 칼럼 추가

VPS와 DNS 연결

VPS 서브도메인 생성(포트 지정)

VPS 페이지 새로고침 및 logout 이슈 해결

.htaccess를 이용한 shared hosting 이슈 해결

VPS pm2 사용법 기록

passport+mysql+vue login 구현

express+vue 로그인 구현

VPS 사용해보기 - 2

VPS 사용해보기

웹페이지 세부 요소 변경하기.

웹페이지 세부 요소 변경하기.

웹페이지 프론트엔드 변경하기.

Hostinger에서 도메인과 호스트를 구입하여 실제 웹페이지를 올려본다..

이더리움 배포

이더리움을 이용하기 위한 트러플 사용

이더리움을 이용하기 위한 초기 세팅 진행. 트러플 이용

웹사이트에서 사용할 달력을 v-calendar를 이용하여 제작한다

1에서 구현한 vue 프론트엔드를 기반으로 express-generator를 통해 백엔드 서버와 연결해보도록 한다

프론트엔드 백엔드를 각각 구현하여 연결해보는 풀스텍 프로젝트를 진행해본다.

본 프로젝트는 정신건강의학과에서 환자를 대상으로 한 신조어 감성분석을 이용한 개인 감정 진단 시스템을 구현하는 것이 프로젝트의 목표로 한다. 웹이나 앱으로 만들어진 감성 일기는 보통 젊은 세대가 많이 사용하기 때문에 감정분석의 정확도를 높히기 위해 신조어 분석 또한 실행한다. 일기장에 일기를 입력했을 때 행복, 즐거움, 분노, 슬픔 4가지 감정을 분류하여 감정을 시각화 하여 나타낸다.

자바스크립트에서 모듈이란 js로 이루어진 작은 기능단위 코드를 지칭한다. 하지만 webpack은 js 모듈 뿐만 아니라 스타일시트, 이미지 등 모든 것을 자바스크립트 모듈로 로딩해서 사용한다. 이러한 웹팩에서 지원하는 Webpack plugin 중 하나인 `Module Federation`은 Micro Frontend 프레임워크를 구현하는 것에 도움을 준다.

webpack 공식 홈페이지 module_federation 파트 번역

효과적인 마케팅을 위해 검색 엔진 최적화(SEO)를 적용하여 유저의 의도를 이해하고, 페이지가 검색 결과 페이지에 잘 노출되도록 웹페이지를 개선하여 자연 유입 트래픽을 늘릴 필요가 있다.이때, SPA(Single Page Application)는 로딩시점에서 검색 엔진이 색인을 할 만한 콘텐츠가 존재하지 않아 SEO가 어렵다는 문제가 있다. SPA는 SSR을 통해 SEO문제를 해결한다.

Micro-frontend 아키텍쳐와 구축을 위한 Single-SPA와 Vue 프레임워크의 사용