본문 바로가기

반응형

개발

(63)
[AWS 자격증] SAA-03 공부 방법, 단기 합격 후기 2023 AWS Certified Solutions Architect – Associate (SAA) 자격증 취득했다! SAA를 취득하려는 목적에 따라 공부하는 방법이 달라질 수 있다. 1. AWS 서비스를 이해하고, 업무에 활용하기 위함 2. 단기간에 SAA 자격증 취득이 목표 처음에는 1로 시작했지만 ^^ 어느정도 공부하고 시험신청 해야지 했다가 신청도 안하고, 공부도 대충하고 계속 미뤄짐,,,,, 결국 걍 시험을 등록하고 똥줄타면서 2로 공부해서 빠르게 합격함. 실무에서 사용하려면 강의를 듣고 서비스를 이해하는게 맞지만 난 우선 자격증을 따고 싶었다. 방법 1. AWS 서비스를 이해하고, 업무에 활용하기 위함 AWS를 처음 접한다면 2개월 이상 넉넉한 공부 기간을 두고 개념을 잡는다. SAA 강의를 듣거나 ..
[css template bootstrap] Html Contact Us, 문의하기 구글 메일 연동 간단한 홈페이지를 개발 중 문의하기 메일연동이 필요했습니다. 서버를 사용하지 않고 html에서 구글 메일을 연동해 사용할 수 있습니다. 참고 https://github.com/dwyl/learn-to-send-email-via-google-script-html-no-server#how GitHub - dwyl/learn-to-send-email-via-google-script-html-no-server: An Example of using an HTML form (e.g: "Contact Us" on a web :email: An Example of using an HTML form (e.g: "Contact Us" on a website) to send Email without a Backend Ser..
[Vue] v-if 와 v-show 차이점 v-if: 조건을 만족하지 못하는 요소는 dom레벨에서 제거됨. 자주 변경되지 않는 경우에 v-if를 사용하는게 좋다. v-show: 조건을 만족하지 못하는 요소는 display:none; 스타일이 적용됨. 스타일만 변경됐을 뿐 눈에보이지 않더라도 항상 렌더링되고 dom에 남아 있다. 조건에 따라 자주 변경되는 버튼 같은 경우에는 v-show를 사용하는게 좋다. 태그에 v-if 가능 , v-show 불가능
[Vuex] Vuex actions란? actions 이해하고 사용하기 actions란? - 비동기 처리 로직을 선언하는 메서드 - 데이터 요청, Promise, ES6 async과 같은 비동기 처리는 모두 actions에 선언 mutations에는 동기적인 메소드를 넣고 actions에 비동기 메서드를 넣는다. 뮤테이션은 commmit api를 호출해서 실행, 액션은 dispatch api를 호출해서 실행시킨다. //store.js state: { num: 10 }, mutations: { doubleNumber(state) { state.num *2; } }, actions: { delay(context) { //actions의 첫번째 인자 context // actions에서 mutations을 접근 할 수 있다. // actions에서 mutations에 접근하는 경..
[Vuex] Vuex mutations란? mutations 이해하고 사용하기 mutations 란? - state의 값을 변경할 수 있는 유일한 방법이자 메서드 (state가 뷰에서 data라면, mutations는 뷰에서 methods와 같은 역할을 한다.) commit() : 뮤테이션을 동작시키는 명령어 [ commit('뮤테이션명', .... ) ] 첫번째 인자는 항상 state, state를 변경하기 위해 다른 인자들을 함께 전달할 수 있다. //store.js state: { num : 10 } mutations: { printNumber(state) { return state.num }, sumNumber(state, num) { return state.num + num }, updateState(state, payload) { return state.num += pa..
[Vuex] Vuex getters란? getters 이해하고 사용하기 getters란? state 값을 접근하는 속성이자, 뷰의 computed()처럼 미리 연산된 값을 접근하는 속성 //store.js state: { num: 10, }, getters: { dobuleNumber(state) { return state.num *2; } } {{ this.$store.getters.doubleNumber }} state: { message: 'hello vue.js!' } {{ this.$store.state.message }} // this.$store.state.message 까지 하면 코드가 많아질수록 번거로울 수 있다. // 헬퍼함수를 쓰게되면 getters로 this.getMeesage 처럼 쉽게 접근 가능하다.
[Vue] Vuex state란? state 이해하고 사용하기 state란 여러 컴포넌트 간에 공유할 데이터 뷰의 데이터랑 똑같이 사용하는데, 여러 컴포넌트에 데이터가 공유가 된다는 점이 다르다. //vue data: { message: ‘hello Vue.js’ } //vuex state: { message: ‘hello vue.js!’ } //vue {{ message }} //vuex {{ this.$store.state.message }} 1. 간단한 데이터 사용 store.js에 state코드를 추가한다. Test.vue(실제 사용하는 뷰파일)에서 state를 사용가능하다. 뷰개발자도구에서 확인 가능하다. 2. 배열 사용 store.js state에 배열을 저장한다. TodoList.vue App.vue에서 v-bind:propsdata="todoItems..
[Vue] Vuex 설치 및 처음 사용하기 https://vuex.vuejs.org/installation.html#direct-download-cdn Installation | Vuex Installation Direct Download / CDN https://unpkg.com/vuex@4 Unpkg.com provides NPM-based CDN links. The above link will always point to the latest release on NPM. You can also use a specific version/tag via URLs like https://unpkg.com/vuex@4.0.0/dist/vuex. vuex.vuejs.org 1. 터미널에서 아래 명령어를 입력하여 설치한다. (라이브러리 버전 명시 해줘야한..

반응형