Vue.js / Nuxt.js

Vue Components

Component lifecycle, props, events, slots, scoped styles, component communication, dynamic components

20 āļ„āļģāļ–āļēāļĄāļŠāļąāļĄāļ āļēāļĐāļ“āđŒÂ·
Junior
1

What is a Vue component?

āļ„āļģāļ•āļ­āļš

A Vue component is a reusable Vue instance with a name. It encapsulates HTML, CSS and JavaScript into an independent logical unit. Components allow dividing the user interface into reusable and maintainable pieces. Each component has its own template, logic and styles, facilitating code organization and reusability.

2

How to declare props in a Vue 3 component with script setup?

āļ„āļģāļ•āļ­āļš

In Vue 3 with script setup, defineProps() is a compiler macro that allows declaring props without explicit import. This macro automatically generates the necessary code and exposes props to the template. It supports TypeScript and JavaScript type validation, making the code more concise and type-safe than the Options API approach.

3

What is the function of the onMounted() hook in a component lifecycle?

āļ„āļģāļ•āļ­āļš

The onMounted() hook executes after the component has been mounted to the DOM. This is the ideal moment to perform operations that require DOM access, like initializing third-party libraries, fetching data via API, or directly manipulating DOM elements. At this stage, the template is rendered and refs are accessible.

4

How does a child component emit an event to its parent component?

5

What are slots used for in a Vue component?

+17 āļ„āļģāļ–āļēāļĄāļŠāļąāļĄāļ āļēāļĐāļ“āđŒ

āļŦāļąāļ§āļ‚āđ‰āļ­āļŠāļąāļĄāļ āļēāļĐāļ“āđŒ Vue.js / Nuxt.js āļ­āļ·āđˆāļ™āđ†

JavaScript Fundamentals

Junior
20 āļ„āļģāļ–āļēāļĄ

Modern JavaScript (ES6+)

Junior
20 āļ„āļģāļ–āļēāļĄ

Vue Basics

Junior
22 āļ„āļģāļ–āļēāļĄ

Vue Router

Junior
18 āļ„āļģāļ–āļēāļĄ

Pinia State Management

Junior
20 āļ„āļģāļ–āļēāļĄ

Vuex (Legacy)

Mid-Level
15 āļ„āļģāļ–āļēāļĄ

Composition API

Mid-Level
24 āļ„āļģāļ–āļēāļĄ

Vue Reactivity

Mid-Level
20 āļ„āļģāļ–āļēāļĄ

Nuxt Fundamentals

Mid-Level
22 āļ„āļģāļ–āļēāļĄ

Nuxt Data Fetching

Mid-Level
20 āļ„āļģāļ–āļēāļĄ

Nuxt SSR & SSG

Mid-Level
22 āļ„āļģāļ–āļēāļĄ

Nuxt Server Routes

Mid-Level
20 āļ„āļģāļ–āļēāļĄ

Nuxt Modules

Mid-Level
18 āļ„āļģāļ–āļēāļĄ

Vue Composables

Mid-Level
20 āļ„āļģāļ–āļēāļĄ

Vue Forms & Validation

Mid-Level
20 āļ„āļģāļ–āļēāļĄ

Nuxt State Management

Mid-Level
18 āļ„āļģāļ–āļēāļĄ

Vue Testing

Mid-Level
20 āļ„āļģāļ–āļēāļĄ

Nuxt Deployment & CI/CD

Mid-Level
22 āļ„āļģāļ–āļēāļĄ

Vue Performance

Senior
22 āļ„āļģāļ–āļēāļĄ

Vue Advanced Patterns

Senior
24 āļ„āļģāļ–āļēāļĄ

TypeScript with Vue

Senior
22 āļ„āļģāļ–āļēāļĄ

Nuxt Authentication

Senior
20 āļ„āļģāļ–āļēāļĄ

SEO with Nuxt

Senior
20 āļ„āļģāļ–āļēāļĄ

Nuxt Internationalization

Senior
18 āļ„āļģāļ–āļēāļĄ

Vue Architecture

Senior
22 āļ„āļģāļ–āļēāļĄ

Nuxt Security

Senior
20 āļ„āļģāļ–āļēāļĄ

Vue Ecosystem

Senior
18 āļ„āļģāļ–āļēāļĄ

Migration Vue 2→3 & Nuxt 2→3

Senior
22 āļ„āļģāļ–āļēāļĄ

āđ€āļŠāļĩāđˆāļĒāļ§āļŠāļēāļ Vue.js / Nuxt.js āļŠāļģāļŦāļĢāļąāļšāļāļēāļĢāļŠāļąāļĄāļ āļēāļĐāļ“āđŒāļ„āļĢāļąāđ‰āļ‡āļ–āļąāļ”āđ„āļ›

āđ€āļ‚āđ‰āļēāļ–āļķāļ‡āļ„āļģāļ–āļēāļĄāļ—āļąāđ‰āļ‡āļŦāļĄāļ” flashcards āđāļšāļšāļ—āļ”āļŠāļ­āļšāđ€āļ—āļ„āļ™āļīāļ„ āđāļšāļšāļāļķāļāļŦāļąāļ” code review āđāļĨāļ°āļ•āļąāļ§āļˆāļģāļĨāļ­āļ‡āļŠāļąāļĄāļ āļēāļĐāļ“āđŒ

āđ€āļĢāļīāđˆāļĄāđƒāļŠāđ‰āļŸāļĢāļĩ