개발경험4 AWS EC2 Ubuntu 초기세팅 + Nginx, NodeJS 설치 AWS EC2 인스턴스 생성 (Ubuntu) AWS 콘솔 접속 EC2 대시보드 접속 인스턴스 시작 이름 입력 app / os 이미지로 ubuntu 선택 인스턴스 유형 선택 (t2.micro) 키 페어 추가 후 pem키 저장&보관 네트워크 설정 인터넷에서 HTTP / HTTPS 트래픽 허용 체크 (선택) SSH 트래픽 허용 지정 AWS EC2 nginx 설치 # Ubuntu 이미지를 이용했을 경우 sudo apt-get install nginx # 다운로드가 완료되면 명령어를 통해 nginx 설치 폴더로 이동한다. cd /etc/nginx # nginx 실행 sudo service nginx start # nginx 실행 확인 ps -ef | grep nginx AWS EC2 Ubuntu Node.js 설.. 2022. 6. 8. 개발 포트폴리오 개발진척 업데이트 현재 완료된 항목 반응형 웹 디자인 SSR i18n 다국어 지원 (영어 - 한국어) 다크/라이트 컬러 테마 변경 Fake 터미널 구현 Vercel 배포 추가 예정 항목 과거 팀프로젝트 경험 소개 페이지 과거 개발한 UI 컴포넌트들 projects/gallery에 추가 Burger 프로젝트 애니메이션 추가 및 보완 three.js 사용, 3d오브젝트 및 로고 추가 이미지 최적화 2021. 12. 6. HTML5 Canvas 성능저하 및 랙 이슈 해결 개요 현재 개발 중인 포트폴리오 사이트에 이전에 제작했던 토이 프로젝트인 Wave를 추가할 때 발생한 문제이다. 아래는 기존에 제작한 Wave 프로젝트의 간략한 설명이다. Wave HTML5 + Javascript App : canvas 생성, 메서드 생성, WaveGroup 생성 WaveGroup : 지정한 wave와 point 개수에 맞춰 파도 각각의 색상과 포인트 지정 후 Wave 생성 Wave : canvas context에 파도를 그린다. 화면 크기 변화 시 각 파도를 resize 한다. 기존 프로젝트의 경우 파도의 갯수와 파도의 높이를 결정하는 waveCount와 pointCount를 WaveGroup 내부에서 하드 코딩하여 미리 지정하고 생성하여, 처음 한 번 canvas를 그릴 때 Wave.. 2021. 11. 26. React + styled-components 재사용 Toggle 버튼 이슈 현재 개발에 참여 중인 MATATA 서비스의 프론트엔드 업무 중 새로운 요구사항을 전달받았다. 디자인 변경으로 인해, 현재 기본 checkbox input을 애니메이션이 추가된 Toggle 버튼으로 바꿔야 했다. 디자인/기획 담당이 원하는 토글 버튼 디자인의 예시로 보내준 링크를 보니, 다음과 같았다. 29 Unique CSS Toggle Switches – FrontEnd Resource Here is a collection of some of the most unique CSS toggle switches for you. You may also like Pure CSS Toggles Dev: Rafael González Pure CSS Toggle Buttons | ON-OFF Switches .. 2021. 10. 18. 이전 1 다음
