Java Scripts (57) 썸네일형 리스트형 Vue - Progress Bar : Axios Interceptors Progress Bar: Axios Interceptors it’s important to design user-friendly applications that give feedback when parts of your webpage are still loading. 웹페이지의 일부가 여전히 로드 중일 때 피드백을 제공하는 사용자 친화적인 애플리케이션을 디자인하는 것이 중요합니다. Installing NProgress Using Axios Interceptors Problem: Our API calls might not always be super fast let our users know the data is on the way, and have something happen when they clic.. Vue : API calls with Axios API Calls with Axios Our app would make a request for the events, the server would respond with those events(as JSON), and we’d take those events and set them as our component’s data, which we then display in the view. 우리 앱은 이벤트를 요청하고 서버는 해당 이벤트(JSON)로 응답하며 해당 이벤트를 component의 데이터로 설정한 다음 뷰에 표시합니다. Create a mock database to house our events Install a library (Axios) to make API Calls Implement a .. Vue : Global Component Why and when you’d want to use global registration 글로벌 등록을 사용하려는 이유와 시기 Automatic Registration 자동등록 How to create an icon component and use it globally 아이콘 구성 요소를 생성하고 전역적으로 사용하는 방법 Why Global Registration? import and locally register it within another component so we could use it in that parent component’s template. 해당 상위 구성 요소의 템플릿에서 사용할 수 있도록 다른 구성 요소 내에서 가져오고 로컬로 등록합니다. with local registrati.. Vue : Single File Component For a more in depth look at how you can configure ESLint + Prettier as well as get the most out of VS Code, you can check out this article. ESLint + Prettier를 구성하고 VS Code를 최대한 활용하는 방법에 대해 자세히 알아보려면 이 문서를 확인하세요. VS Code for Vue.js Developers | Vue Mastery VS Code for Vue.js Developers | Vue Mastery Learn why VS Code is the best code editor for Vue development and how to set it up for the best de.. Vue : Nested Routes Nested Routes Each URL provides different information on that resource: 각 URL은 해당 리소스에 대한 다양한 정보를 제공합니다. /event/2 - Event Details (information) /event/2/register - Event Register (to signup for the event) /event/2/edit - Event Edit (to edit the event) Problem: Where do we place these components? Solution: In their own folder. (event folder) /event/2 /src/views/event/Details.vue /event/2/register.. Vue : Dynamic Routing & History Mode we’ll cover the creation of dynamic routes and how to use HTML5 History Mode to get rid of that # in our URL. dynamic routes 생성과 HTML5 History Mode 를 사용하여 URL에서 #을 제거하는 방법을 다룰 것입니다. Problem: How to create dynamic routes like /users/gregg or /users/jinha? Solution: Dynamic Routes { path: '/event/:id', name: 'event-show', component: EventShow, props: true }, the path has /user/:username. :username.. Vue Router Basics General Term Project 안의 package.json 에 아래와 같은 dependency item 이 있는데 아래와 같은 의미를 갖는다.. "vue-router": "^3.0.1", use the latest version of vue-router that is compatible with version 3.0.1 of the Vue-Router. Vue-Router 버전 3.0.1과 호환되는 최신 버전의 vue-router를 사용하세요. component (from the vue-router library) whose job is to link to a specific route. 특정 경로에 연결하는 작업을 수행하는 component ( from vue-router 라이브러리의)입니다. .. Vue : Slots: Fundamentals Slots: Fundamentals When you need to take your components to the next level beyond props, the use of slots is the next technique to enhance your components. Props을 넘어 components를 다음 단계로 끌어올려야 할 때 슬롯을 사용하는 것은 components 를 향상시키는 다음 기술입니다. Materials Objective How to use slots for dynamic template code (basic slot) 동적 템플릿 코드를 위한 슬롯 사용 방법(기본 슬롯) How to set default slot content 기본 슬롯 콘텐츠를 설정하는 방법 How .. 이전 1 2 3 4 5 6 7 8 다음