분류 전체보기80 DNS란? DNS는 인터넷의 전화번호부와 같습니다. 사람들이 웹사이트에 접속할 때, 웹 브라우저는 사람이 이해할 수 있는 도메인 이름(예: www.example.com)을 컴퓨터나 다른 네트워크 장비가 이해할 수 있는 IP 주소로 변환해야 합니다. DNS 서버는 이 도메인 이름을 IP 주소로 변환하는 역할을 합니다. DNS의 작동 방식 1. 사용자가 웹 브라우저에 URL 입력: 사용자가 웹 브라우저에 URL을 입력하면, 브라우저는 DNS 쿼리를 시작합니다.2. DNS 쿼리 처리: 브라우저는 설정된 DNS 서버에 접속하여 해당 도메인 이름에 대한 IP 주소를 요청합니다.3. DNS 서버의 응답: DNS 서버는 해당 도메인의 IP 주소를 찾아 브라우저에게 전달합니다. 만약 DNS 서버가 해당 정보를 가지고 있지 않다면.. 2022. 1. 24. [vue] provide / inject 컴포넌트 계층 구조가 굵어 여러 단계를 거쳐 props를 해야 하는 경우 매우 귀찮고 복잡해 질 수 있다. 그럴 때 provide / inject 를 사용 export default { name: 'Home', components: { About }, provide () { return { provideDate: [1, 2, 3, 4, 5] } } } provide로 데이터를 뿌리고 export default { name: 'Children', inject: ['provideDate'] } inject로 받아온다. 다만 위와 같이 사용했을 시 어느 부모컴퍼넌트에서 받아온 값인지 찾기 힘들 수 있다. 그래서 inject의 형태를 변경해 조금 더 상세한 설정이 가능함 //부모 //자식 {{ injectDat.. 2022. 1. 19. [vue] v-slot 컴포넌트의 디자인을 바로 아래에 있는 컴퍼넌트에 전달해 재활용할 수 있는 기능이다. 부모 컴퍼넌트에 v-slot (#title) 로 정의 후 제목입니다 export default { name: 'Home', components: { About }, } 자식 컴퍼넌트에 를 이용해여 재활용한다 about 이라는 자식컴퍼넌트에선 로 감싸진 화면을 손쉽게 재활용 가능 동적으로 slot 할당하기 slotNum 데이터를 이용해 slot id를 동적으로 부여했다. 버튼을 클릭할때마다 slot id가 1,2를 왕복하며 움직인다. //부모 컴퍼넌트 {{slotNum}} //자식컴퍼넌트 1번쨰 슬롯 슬롯바깥 slotNum이 1일때에는 "슬롯바깥"이 출력되고 slotNum이 2일때에는 "1번째 슬롯"과 "슬롯바깥"이 출력된.. 2022. 1. 19. [vue] props props는 부모컴퍼넌트에서 자식 컴퍼넌트로 값을 전달할떄 사용함 단순 값 전달뿐 아니라 아래의 옵션 설정도 가능하다. props 각종 옵션들 - required 필수여부 - default 기본 값 - validator 유효성 검사 함수 #type props: { title: { type: [String,Number] //여러가지 타입 허용 } } #required props: { title: { type: [String,Number], //여러가지 타입 허용 required: true //필수로 전달 받아야함 } } #default props: { title: { type: [String,Number], //여러가지 타입 허용 default: 100 //부모 컴퍼넌트에서 보내주는 값이 없을시 기본값으로.. 2022. 1. 19. [vue] vue 키 이벤트 1차적으로 up, down, press를 입력한 후 추가로 enter, left, right, esc 등 조합하여 사용할 수 있다 data () { return { name: '' } }, methods: { printEvent (val) { console.log(val) } } 2022. 1. 19. [vue] watch / computed / watcheffect 위 키워드들은 데이터 값이 바뀔때마다 감시자 역할을 해주는 메소드들임 https://v3-docs.vuejs-korea.org/guide/essentials/watchers.html 감시자 | Vue.js v3-docs.vuejs-korea.org watch # watch 간단하게 사용하기 # 객체 감지하기 객체를 감지할때는 객체안의 요소만 감지할수는 없다. 첫번째 나열된 watch처럼 b 객체 전체를 감지해야한다. 이로 인해 특정한 데이터만 추출하여 감시하는 것이 아닌, 불필요한 데이터 전체를 감시하게 되어버리는데 이는 watch 문장을 조금 바꾸어주면 해결됨 # 기타 옵션들 ## deep deep은 배열이나 객체등 깊게 감시해주도록 나온것인데, 위에 나온대로 watch 문장을 바꾸어주니 해결됐음 v.. 2022. 1. 19. 이전 1 ··· 9 10 11 12 13 14 다음
