본문 바로가기

공부120

AWS : ISV General Immersion Day1 AWS ISV General Immersion Day Class에서 배운 내용 정리. [2022-10-11 교육] Do it! 3 tier web application 컴퓨트 - Amazon EC2 네트워크 - Amazon VPC 보안 - AWS IAM 모니터링 - Amazon CloudWatch 데이터베이스 - Amazon RDS 스토리지 - Amazon S3 네트워크 구성하기 1. VPC 만들기 - 사용자가 정의하는 논리적으로 격리된 가상 네트워크에서 AWS 리소스를 시작할 수 있다. 2. 추가 서브넷 생성하기 3. 라우팅 테이블 편집하기 4. 보안 그룹 생성하기 인스턴스 생성하기 - VPC내 Private subnet 들에 Auto Scaling Group을 이용하여 웹 서비스 인스턴스를 배포 웹 .. 2022. 11. 22.
Mac Java_Home 환경 변수 설정 JDK 기본 설치 경로는 /Labrary/Java/JavaVirtualMachines 이다. 나는 웹에서 설치하지 않고 SDKMAN! 이라는 SDK의 병렬 버전을 관리하기 위한 도구를 사용해서 Java를 설치했었다. Java_Home을 설정했다면 설치 경로를 확인 할 수 있다. SDKMAN 설치 방법 curl -s "https://get.sdkman.io" | bash zsh 사용자는 vi .zshrc , bash 사용자는 vi .bash_profile 파일에 아래 코드를 추가한다. export SDKMAN_DIR="$HOME/.sdkman" [[ -s "$SDKMAN_DIR/bin/sdkman-init.sh" ]] && source "$SDKMAN_DIR/bin/sdkman-init.sh" 그리고 아래.. 2022. 11. 21.
[PJ] Vue 공부중9 vue 단축..이모지? v-bind: = : v-on: = @ v-slot = # 컴포넌트에서 v-model 사용하기 TodoForm 에서 사용하던 Input Box 들을 Input 이라는 component로 따로 빼서 사용해보도록 한다. 공식 문서에서는 Multiple v-model 이라는 내용으로 찾을수 있다.(고 한다. 못찾음 ㅠ) TodoForm.vue ... Subject {{ subjectError }} ... Input.vue 로 form 옮기기 바인딩을 통해 데이터를 연결하고, 클릭이벤트도 연결해준다. Input.vue {{ label }} {{ error }} TodoForm.vue ... ... v-on 과 v-bind, 그리고 함수를 통해 변경된 값을 적용시켜 보았다. 이것을 v-mo.. 2022. 10. 19.
[PJ] Vue 공부중8 slot 언제하지ㅣ.... Q. package-lock.json, package.json 은 gitignore를 해야 할까요? A. NOPE! https://chanie.tistory.com/m/10 node modules와 gitignore, package.json의 관계 node module을 사용하는 자바스크립트, 노드js, 리액트 관련 프로젝트를 할때 Create React App으로 프로젝트를 생성을 하면 기본적으로 gitignore파일에 node modules 경로가 잡히게 된다. 변경사항을 추적하 chanie.tistory.com https://blog.naver.com/gingsero/222140320340 package-lock.json 은 git ignore 처리해야할까? https:/.. 2022. 10. 5.
[PJ] Vue 공부중7 Teleport 원하는 코드를 원하는 곳으로 이동 가능 index.html modal div 추가 pages/todos/index.vue style 투명도 추가 ... components/TodoList.vue index.html 에 있는 modal 로 이동시켜버림 모달이 위에 잘 뜸. API 연동 문제 - CORS - 해결 최 상단에 vue.config.js 파일 생성 module.exports = { publicPath: "./", devServer: { proxy : 'API URL' } }; Home.vue const getLists =async () =>{ try{ const res = await axios.get("/board"); console.log(res.data); } catch(err.. 2022. 10. 4.
[PJ] Vue 공부중6 Vue Lifecycle hooks 공식문서 onUnmounted를 활용한 메모리 누수 관리 const timeout = ref(null); // 페이지를 벗어날 때 timeout value를 clear 해준다. // 그럼 페이지 이동시 triggerToast의 setTimeout이 실행되지 않음. onUnmounted(() => { clearTimeout(timeout.value); }); const triggerToast = (message, type = "success") => { toastAlertType.value = type; toastMessage.value = message; showToast.value = true; // 페이지를 벗어났을 때 아래 부분을 실행 시킬 필요 없다. timeo.. 2022. 10. 3.