개발자의 품격155 [Vue.js 프로젝트 투입 일주일 전] 10장 - Proxy 사용하기 10.1 프록시(proxy) 서버 - 프록시 서버: 클라이언트가 자신을 통해서 다른 네트워크 서비스에 간접적으로 접속 가능하게 해주는 응용 프로그램 - 클라이언트와 서버 사이에서 HTTP 요청과 응답을 대신 처리해주는 역할을 하는 서버 10.2 CORS란 - CORS: 웹 애플리케이션에서 도메인, 포트, 프로토콜이 다른 곳으로 HTTP 요청을 보낼 수 없도록 브라우저가 요청을 막는 보안 정책 10.3 CORS 해결방법 - 서버에서 접근 허용 - 프록시 서버 이용 10.4 Proxy 설정하기 - Vue에서 proxy 설정하고 클라이언트에서 HTTP 요청 (포트: 8080)하면 Proxy 서버가 웹 서버로 HTTP 요청 (포트: 3000)을 대신 함으로써 CORS 문제 해결 - 운영 환경에서는 제대로 실행 .. 2022. 4. 30. [Vue.js 프로젝트 투입 일주일 전] 9장 - Reusability & Composition 9.1 Composition API - Composition API란? - 컴포넌트 내에서 사용하는 특정 기능을 갖는 코드를 유연하게 구성하여 사용할 수 있도록 Vue 3에 추가된 함수 기반의 API - Setup 메소드 안에서 한 덩어리로 코드 구현 가능 (코드 관리 쉬워짐) - 특정 기능을 갖는 함수를 정의하고, API 처럼 사용할 수 있게 해줌 - 코드에 대한 재활용성을 높이고, 코드의 가독성을 높임, 코드 추적 및 유지 관리 쉬워짐 (연관성 있는 로직 모아놓음) - Setup - 컴포지션 API 구현하는 곳 - reactive 이용 - reactive, computed 이용 - reactive, computed, toRefs 이용 - Lifecycle Hooks - setup()는 beforeCr.. 2022. 4. 30. [Vue.js 프로젝트 투입 일주일 전] 8장 - 컴포넌트 심화 학습 8.1 컴포넌트 안에 다른 컴포넌트 사용하기 - 부모 컴포넌트와 자식 컴포넌트 - 사용할 컴포넌트를 import 한 후 현재 컴포넌트의 템플릿에서 사용할 컴포넌트를 components에 등록 - 개발하면서 각 페이지의 타이틀의 색상이나 레이아웃 변경 등 디자인 변경이 필요한 경우, 페이지 타이틀 컴포넌트만 수정하면 모든 화면에 반영되므로 효율적으로 관리 가능 - 컴포넌트는 페이지 하나 전체가 될 수도 있고, 하나의 페이지를 이루고 있는 단위 요소일 수도 있음 - 부모 컴포넌트에서 자식 컴포넌트로 데이터 전달하기: Props - 정적/동적 Prop 전달 - v-bind나 약어 : 문자를 사용해서 prop에 동적인 값 전달 가능 - 숫자형(Number) 전달 - v-bind를 통해서만 가능 - 전달되는 데이.. 2022. 4. 30. [개품 부트캠프 스터디] - 일곱 번째 미팅 2022.04.30.토 개품 부트캠프 스터디 일곱 번째 미팅에 참여했습니다. 오늘부터 약 한 달간 네트워크와 함께 Vue.js도 병행하게 되었습니다. 스터디 예상 종료 일자는 동일하게 5/29 일요일입니다. 네트워크 스터디에서는 IP 프로토콜 위주로 네트워크 계층에 대해 살펴봤습니다. 패킷의 전달 경로를 결정하는 라우팅 프로토콜의 종류들에 대해 알아보면서 혼잡 제어 기능을 학습했습니다. Vue.js 스터디에서는 전반적인 스터디 진행 절차 공유와 목차를 간단히 살펴보면서 개념을 조금 복기하고, 첫 단원인 Vue.js 의 소개와 장점에 대해 알아봤습니다. 확실히 컴퓨터 사이언스 이론 말고 Vue.js 스터디도 병행해서 더 재밌는 것 같습니다. 남은 한달 동안 열심히 잘 참여하겠습니다. 2022. 4. 30. 이전 1 ··· 16 17 18 19 20 21 22 ··· 39 다음 반응형