Tutorial: Beginner to Front-End Developer

In this comprehensive course, Jeremy McPeak will teach you the fundamental concepts you need to start building applications with Vue 3. ► Download scripts and plugins from CodeCanyon: UI frameworks have drastically changed the way we write web applications. There are many frameworks to choose from, and picking one can be hard. In this course, you’ll learn why is a great choice, and you’ll discover how to use it in detail. You’ll start with building the simplest Vue components and learning to use core features like data binding, props, events, and computed properties. Then you’ll build that knowledge step by step with practical projects learning how to use the Vue CLI, forms, watchers, and custom events. You’ll also master key concepts like the Vue router and the Composition API. By the end of this course, you’ll be confident in using for all your front-end development projects. Here’s what the course covers: 1. Introduction 00:00:00 1.1 Introduction 2. With no Tool-Chain 00:02:31 2.1 Getting Started With Vue 00:10:51 2.2 Using Loops to Generate Content 00:17:00 2.3 Binding Data to Attributes 00:25:11 2.4 Setting Up Events 00:33:15 2.5 Binding CSS Classes I 00:41:48 2.6 Using Computed Properties 00:48:05 2.7 Binding CSS Classes II 00:55:00 2.8 Introducing Components 01:04:19 2.9 Understanding Data Flow 3. Using the Vue CLI 01:13:00 3.1 Getting Started With the Vue CLI 01:21:30 3.2 Starting a Project From Scratch 01:32:18 3.3 Applying CSS to Components 4. Working With Data 01:41:51 4.1 Using the created() Lifecycle Event to Load Data 01:48:19 4.2 Working With Unset Props 01:55:19 4.3 Deciding When to Load Data 02:01:14 4.4 Working With Forms 02:08:43 4.5 Validating Forms 02:14:39 4.6 Updating and Filtering Data 02:21:05 4.7 Using Watchers 5. Creating and Using Custom Events 02:25:19 5.1 Creating Custom Events 02:32:48 5.2 Writing a Global Event Bus 6. Using Vue Router 02:44:37 6.1 Introducing Vue Router 02:53:19 6.2 Using Route Params 02:59:18 6.3 Loading Data for Views 03:10:07 6.4 Watching Params to Reload Data 03:16:57 6.5 Using the Router’s Active Class 03:23:36 6.6 Nesting Routes 7. Using the Composition API 03:30:52 7.1 Introducing the Composition API 03:40:26 7.2 Providing and Injecting Dependencies Into Components 03:48:18 7.3 Accessing Props and Router Functions 03:54:58 7.4 Binding Data and Working Wth Forms 04:06:00 7.5 Defining Computed and Watched Values 04:16:18 7.6 Implementing the Delete Functionality 8. Conclusion 04:20:42 8.1 Conclusion NOTE: Current recommendations are to use create-vue with the Vite tooling for new Vue projects. vue-cli is in maintenance mode, but still works for creating Webpack-powered Vue apps like in this course. ► Download unlimited photos, fonts, and templates with Envato Elements: Read free Vue tutorials on Envato Tuts : - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Envato Tuts Discover free how-to tutorials and online courses. Design a logo, create a website, build an app, or learn a new skill: Envato Elements All the creative assets you need under one subscription. Customize your project by adding unique photos, fonts, graphics, and themes. ► Download Unlimited Stock Photos, Fonts & Templates with Envato Elements: ► Subscribe to Envato Tuts on YouTube: ► Follow Envato Tuts on Twitter: ► Follow Envato on Facebook: - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Back to Top