본문 바로가기

분류 전체보기

(71)
Amplify로 static 리소스 호스팅하기 Upload codes on Github Registry우선 Amplify에서 호스팅할 코드를 github 레지스트리에 업로드한다.my-v0-resume에 있는 코드를 올려보려고 한다. Create Amplify Application and Select 'Github' Option '다음'을 누르면 github 리포지토리 접근 권한을 얻기 위한 창이 뜨는데, 권한을 주면 된다. Add Github Repository and Branch연동해주면 자동으로 리포지토리와 브랜치 리스트가 뜬다. 업로드하고자 하는 리포지토리와 브랜치를 선택한다. Specify Application기본적으로 Amplify에서 github의 코드를 읽고 자동으로 설정 값을 넣어준다. yml 파일도 별도 수정이 필요 없다.Final ..
클라우드 아키텍처 구축 Best Practice 모음 보안IGLOO - 자동화 및 지능적 차세대 보안관제 체계의 성공적인 구축 사례Ahn lab - 금융 마이데이터 구현을 위한 클라우드 아키텍쳐 설계toss - 금융사 최초의 ZeroTrust 아키텍쳐 도입기연구논문 - 개인정보보호를 위한 Azure 클라우드 보안 아키텍처 구성가용성SAMSUNG SDS - 가용성 측면의 클라우드 아키텍쳐
3-tier architecture on EC2, RDS (Vue.js+Node.js+MySQL) 본 글은 Vue.js, Node.js, MySQL 기반의 3-tier architecture를 AWS 상에 구축한 내용을 정리한 것입니다. 계정 분리 (Root / IAM User)적용: root 계정과 IAM user 계정을 분리하여 root 계정에서는 비용 현황을 모니터링하고, user 계정으로는 AWS 서비스를 기반으로 아키텍쳐를 구축하였습니다.설명: root 계정은 AWS 계정을 처음 생성할 때 사용하는 계정으로, 계정에 대한 모든 권한(결제 관리, 서비스 설정, 계정 폐쇄, 인증 관리)을 갖고있어 이 계정이 해킹되거나 악용될 시 전체 AWS 리소스가 위험에 처할 수 있습니다. 따라서 root 계졍과 IAM user 계정을 분리해 사용하는 것이 보안상 안전합니다.망분리 (Public / Priva..
개인프로젝트 1-5 리퀘스트 처리를 위한 WAS 서버 구축 Node.js 서버 환경 설정필요한 패키지 설치$ npm install express mysql body-parser bcryptjsexpress: 서버를 구성하는 데 사용mysql: MySQL 데이터베이스 연결을 위해 사용body-parser: POST 요청의 본문을 파싱bcryptjs: 비밀번호를 암호화하고 비교하는 데 사용 웹서버 코드 작성이것도 chatgpt한테 시킴. 편안함과 동시에 느껴지는 위기감 (편안함 승)// server.jsconst express = require('express');const mysql = require('mysql');const bodyParser = require('body-parser');const bcrypt = require('bcryptjs');const ..
개인프로젝트 1-4 화면구성 Vue.js 구성 및 동작 원리를 잘 몰라서 간단히 공부할 필요가 있었다그치만 아키텍쳐 위주로 프로젝트를 진행하는 거라 내부 프론트 백 코드를 상세하게 짚고 간다기보다는 목표로 한 서비스를 빠르게 만들 수 있을 정도로만 훑었고 아래 글들에 설명이 잘 되어있었다. 🔗 재그지그의 개발 블로그 - Vue 라이프사이클 이해하기https://wormwlrm.github.io/2018/12/29/Understanding-Vue-Lifecycle-hooks.html 🔗 개발자의 품격 - 한 시간만에 끝내는 Vue.js 입문https://www.youtube.com/watch?v=sqH0u8wN4Rs 🔗 워냐의 개발일기 - vue 모바일 웹 설정https://wonya-dev.tistory.com/9 🔗 npm..
개인프로젝트 1-3 S3에 Vue.js static 리소스 올리기 (v0.dev) 정적 리소스 S3에 업로드개발을 다 완전히 마치고 올리면 좋겠지만, 그래도 AWS 사용법을 익히며 개발하는 것이 나에게 더 도움되기 때문에 기본으로 제공되는 index 파일을 S3에 올려보려고 한다.Vue.js는 클라이언트 사이드 렌더링 방식이어서, 정적 리소스들을 S3에 올려 웹서버가 클라이언트의 요청이 있을 때마다 제공하고, 그 뒷단의 다른 동적인 액션들은 웹 애플리케이션 서버가 처리하도록 한다.관련 내용을 이전 포스트에서 다룬 적이 있다.  Server-side rendering Vs. Client-side rendering nolzaheo.tistory.com Vue.js를 S3에 올리는 단계까지를 설명해주는 블로그들은 많다. 이거보고 참고했다.  Vue2를 AWS S3에 배포하고 운영해보자Vue..
개인프로젝트 1-2 환경 구축 깃헙 스토리지 생성QuietTime vue 설치m1환경이라 node도 특정 버전 이상을 써야했고homebrew설치, nvm 설치부터 다 다시함챗 지피티가 친절하게 알려줌chromedriver도 최신으로 다시 설치하고 별짓다함 설치 도중 마주하는 문제들은 chatgpt한테 물어보면 됨$ sudo chown -R $(whoami) ~/.npm $ npm install -g @vue/cli$ npm i -g @vue/cli-init$ vue init webpack qtime$ nvm install 14.19.3$ nvm alias default 14.19.3 AWS 계정 설정정석을 따르기 위해 루트 사용자와 IAM 사용자를 분리 [AWS] AWS 계정 관리(ROOT, IAM)AWS 계정 관리에 대해 나중에 까..
개인프로젝트 1-1 - Vue.js를 활용한 Q.T용 웹앱 만들기 앱 구현은 사용자가 불편하다고 느낄 수 있을 것 같아 웹앱으로 구현한다. 기술 스택MEVN(MySQL, Express.js, Vue.js, Node.js) 개발배경 AWS 공부를 위해 AWS에 올릴 서비스가 필요했고, 3-tier architecture를 복습할겸 마침 교회에 필요한 말씀 묵상 공유 서비스를 만들면 좋겠다고 생각함.개발목표기간: 2024/10/24~2024/11/30(has been delayed)기능: 카카오 로그인, 큐티방 생성, 묵상 작성, 묵상 캘린더, 댓글 UI(업로드 예정) 아키텍쳐처음에는 익숙한대로 인스턴스 단위로 구성할까 했지만, AWS 공부를 위한 프로젝트인 만큼 AWS의 S3, lambda, RDS를 활용해보려한다.- 정적 리소스를 S3에 호스팅- VPC, EC2, RD..