Vue.js and Vuetify Data Table with Paging, Sorting, & Pagination
In this tutorial, we will learn how to create a data-table using Vue.js and Vuetify, with data from a REST API. The data-table will have features such as sorting, pagination ...and paging.
The vuetify's v-data-table is an incredibly powerful and flexible component that offers customization options for handling large amount of data. This tutorial will show you how to add vuetify in a vuejs application as well as the configurations involved.
GitHub Link:
https://github.com/desoga10/v-data-table
Checkout my MEAN Stack course on Educative:
https://www.educative.io/courses/building-a-full-stack-application-using-the-mean-stack
Support the channel:
https://www.buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
For more resources on Web Development:
https://thecodeangle.com/
Follow Me on Twitter:
https://twitter.com/thecodeangle
###########################################################
Vue.js and Vuetify Data Table with Paging, Sorting, & Pagination:
Introduction - 00:00
01:06 Installation of the Vue.js CLI
01:56 Creating the vue.js project
07:46 Installation of Vuetify
09:00 Fetch the Data from the REST API
20:15 Displaying the Data in the Data Table
26:40 Outro
Leave a like and subscribe for more videos.
Thanks a lot for watching ❤[+] Show More
The vuetify's v-data-table is an incredibly powerful and flexible component that offers customization options for handling large amount of data. This tutorial will show you how to add vuetify in a vuejs application as well as the configurations involved.
GitHub Link:
https://github.com/desoga10/v-data-table
Checkout my MEAN Stack course on Educative:
https://www.educative.io/courses/building-a-full-stack-application-using-the-mean-stack
Support the channel:
https://www.buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
For more resources on Web Development:
https://thecodeangle.com/
Follow Me on Twitter:
https://twitter.com/thecodeangle
###########################################################
Vue.js and Vuetify Data Table with Paging, Sorting, & Pagination:
Introduction - 00:00
01:06 Installation of the Vue.js CLI
01:56 Creating the vue.js project
07:46 Installation of Vuetify
09:00 Fetch the Data from the REST API
20:15 Displaying the Data in the Data Table
26:40 Outro
Leave a like and subscribe for more videos.
Thanks a lot for watching ❤[+] Show More

active
Vue.js and Vuetify Data Table with Paging, Sorting, & Pagination
In this tutorial, we will learn how to create a data-table using ...
In this tutorial, we will learn how to create a data-table using Vue.js and Vuetify, with data from a REST API. The data-table will have features such as sorting, pagination ...and paging.
The vuetify's v-data-table is an incredibly powerful and flexible component that offers customization options for handling large amount of data. This tutorial will show you how to add vuetify in a vuejs application as well as the configurations involved.
GitHub Link:
https://github.com/desoga10/v-data-table
Checkout my MEAN Stack course on Educative:
https://www.educative.io/courses/building-a-full-stack-application-using-the-mean-stack
Support the channel:
https://www.buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
For more resources on Web Development:
https://thecodeangle.com/
Follow Me on Twitter:
https://twitter.com/thecodeangle
###########################################################
Vue.js and Vuetify Data Table with Paging, Sorting, & Pagination:
Introduction - 00:00
01:06 Installation of the Vue.js CLI
01:56 Creating the vue.js project
07:46 Installation of Vuetify
09:00 Fetch the Data from the REST API
20:15 Displaying the Data in the Data Table
26:40 Outro
Leave a like and subscribe for more videos.
Thanks a lot for watching ❤[+] Show More
The vuetify's v-data-table is an incredibly powerful and flexible component that offers customization options for handling large amount of data. This tutorial will show you how to add vuetify in a vuejs application as well as the configurations involved.
GitHub Link:
https://github.com/desoga10/v-data-table
Checkout my MEAN Stack course on Educative:
https://www.educative.io/courses/building-a-full-stack-application-using-the-mean-stack
Support the channel:
https://www.buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
For more resources on Web Development:
https://thecodeangle.com/
Follow Me on Twitter:
https://twitter.com/thecodeangle
###########################################################
Vue.js and Vuetify Data Table with Paging, Sorting, & Pagination:
Introduction - 00:00
01:06 Installation of the Vue.js CLI
01:56 Creating the vue.js project
07:46 Installation of Vuetify
09:00 Fetch the Data from the REST API
20:15 Displaying the Data in the Data Table
26:40 Outro
Leave a like and subscribe for more videos.
Thanks a lot for watching ❤[+] Show More

active
Create a Simple Blog Application using Caisy headless CMS and Next.js
In this video, we will build a simple blog application using the Caisy ...
In this video, we will build a simple blog application using the Caisy headless CMS and NextJs. We will make use of one of the blog templates in the Caisy ...dashboard to quickly setup, configure and create the blog application.
After this, we then deploy the application live on Vercel.
Caisy Affiliate Link:
https://app.caisy.io/app/signup/ev9dr3nf02xl
promo code to save 20 % :
**TheCodeAngle20**
Checkout my MEAN Stack course on Educative:
https://www.educative.io/courses/building-a-full-stack-application-using-the-mean-stack
Support the channel:
https://www.buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
For more resources on Web Development:
https://thecodeangle.com/
Follow Me on Twitter:
https://twitter.com/thecodeangle
###########################################################
Timestamps for Create a Simple Blog Application using Caisy headless CMS and Next.js
Introduction - 00:00
03:00 Account creation
06:40 Blog Configuration
19:25 Deployment to Vercel
24:15 Outro
###########################################################
Leave a like and subscribe for more videos.
Thanks a lot for watching ❤[+] Show More
After this, we then deploy the application live on Vercel.
Caisy Affiliate Link:
https://app.caisy.io/app/signup/ev9dr3nf02xl
promo code to save 20 % :
**TheCodeAngle20**
Checkout my MEAN Stack course on Educative:
https://www.educative.io/courses/building-a-full-stack-application-using-the-mean-stack
Support the channel:
https://www.buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
For more resources on Web Development:
https://thecodeangle.com/
Follow Me on Twitter:
https://twitter.com/thecodeangle
###########################################################
Timestamps for Create a Simple Blog Application using Caisy headless CMS and Next.js
Introduction - 00:00
03:00 Account creation
06:40 Blog Configuration
19:25 Deployment to Vercel
24:15 Outro
###########################################################
Leave a like and subscribe for more videos.
Thanks a lot for watching ❤[+] Show More

active
Create a Sortable Table in Vanilla JavaScript using Data from a REST API
In this tutorial, we will learn how to make an HTML table with custom ...
In this tutorial, we will learn how to make an HTML table with custom sorting functionality using Vanilla JavaScript. We will be using the DOM manipulation in JavaScript to achieve ...this feature.
We begin by designing the table with Bootstrap 5, then we fetch the data for the table using the CoinRanking API which contains data about different types of cryptocurrency.
Finally, we implement the custom sorting functionality in JavaScript.
GitHub Link:
https://github.com/desoga10/table-sort-javascript
Checkout my MEAN Stack course on Educative:
https://www.educative.io/courses/building-a-full-stack-application-using-the-mean-stack
Era Note-Taking App:
https://era.sh/
Support the channel:
https://www.buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
For more resources on Web Development:
https://thecodeangle.com/
Follow Me on Twitter:
https://twitter.com/thecodeangle
###########################################################
Timestamps for Creating a Sortable Table in Vanilla JavaScript using Data from a REST API:
Introduction - 00:00
02:47 Project Set Up and Table Design
10:50 Configuring the REST API
24:12 Creating the Sort Function
31:30 Outro
###########################################################
Leave a like and subscribe for more videos.
Thanks a lot for watching ❤[+] Show More
We begin by designing the table with Bootstrap 5, then we fetch the data for the table using the CoinRanking API which contains data about different types of cryptocurrency.
Finally, we implement the custom sorting functionality in JavaScript.
GitHub Link:
https://github.com/desoga10/table-sort-javascript
Checkout my MEAN Stack course on Educative:
https://www.educative.io/courses/building-a-full-stack-application-using-the-mean-stack
Era Note-Taking App:
https://era.sh/
Support the channel:
https://www.buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
For more resources on Web Development:
https://thecodeangle.com/
Follow Me on Twitter:
https://twitter.com/thecodeangle
###########################################################
Timestamps for Creating a Sortable Table in Vanilla JavaScript using Data from a REST API:
Introduction - 00:00
02:47 Project Set Up and Table Design
10:50 Configuring the REST API
24:12 Creating the Sort Function
31:30 Outro
###########################################################
Leave a like and subscribe for more videos.
Thanks a lot for watching ❤[+] Show More

active
How to Add Authentication to an Angular 16 App with Supabase
In this Angular 16 tutorial, I will show you how to add authentication ...
In this Angular 16 tutorial, I will show you how to add authentication to an Angular app with Supabase.
We will make use of some recent updates in the Angular 16 ...framework such as:
+ Lazyloading Routes using the functional approach
+ Integrating the newly created provideHttpClient in Angular 16
+ Reactive Form Validation
In addition, we will make use of ChatGPT to generate our user interface. Then I'll also show you how to integrate Supabase into an Angular 16 Project.
GitHub Link:
https://github.com/desoga10/ng-supabase
Checkout my MEAN Stack course on Educative:
https://www.educative.io/courses/building-a-full-stack-application-using-the-mean-stack
Support the channel:
https://www.buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
For more resources on Web Development:
https://thecodeangle.com/
Follow Me on Twitter:
https://twitter.com/thecodeangle
###########################################################
Timestamps for How to Add Authentication to an Angular 16 App with Supabase:
Introduction - 00:00
03:45 Generate all necessary Components
05:20 Design Implementation using ChatGPT
11:45 Implement routes for lazy loading
20:45 Create Angular Service
22:25 Supabase setup
27:40 Implement Form validation in Reactive forms
39:10 Create Supabase Authentication services
42:15 Integrate the Supabae Auth services in the component file
50:58 Outro
###########################################################
Leave a like and subscribe for more videos.
Thanks a lot for watching ❤[+] Show More
We will make use of some recent updates in the Angular 16 ...framework such as:
+ Lazyloading Routes using the functional approach
+ Integrating the newly created provideHttpClient in Angular 16
+ Reactive Form Validation
In addition, we will make use of ChatGPT to generate our user interface. Then I'll also show you how to integrate Supabase into an Angular 16 Project.
GitHub Link:
https://github.com/desoga10/ng-supabase
Checkout my MEAN Stack course on Educative:
https://www.educative.io/courses/building-a-full-stack-application-using-the-mean-stack
Support the channel:
https://www.buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
For more resources on Web Development:
https://thecodeangle.com/
Follow Me on Twitter:
https://twitter.com/thecodeangle
###########################################################
Timestamps for How to Add Authentication to an Angular 16 App with Supabase:
Introduction - 00:00
03:45 Generate all necessary Components
05:20 Design Implementation using ChatGPT
11:45 Implement routes for lazy loading
20:45 Create Angular Service
22:25 Supabase setup
27:40 Implement Form validation in Reactive forms
39:10 Create Supabase Authentication services
42:15 Integrate the Supabae Auth services in the component file
50:58 Outro
###########################################################
Leave a like and subscribe for more videos.
Thanks a lot for watching ❤[+] Show More

active
Angular 16 Tutorial - Fetch Data Using the provideHttpClient
In this Angular 16 tutorial, we will learn how to work with ...
In this Angular 16 tutorial, we will learn how to work with provideHttpClient in standalone components in Angular to have access to HTTP client requests.
The provideHttpClient() API is the ...way to go if you work with module-less Angular applications and don’t want to use NgModule.
This tutorial provides a step-by-step guide on how to integrate the provideHttpClient() into your module-less, standalone application with no skipped steps.
At the end of the tutorial, we will consume the JSON Placeholder REST API to ensure our integrations work perfectly.
Timestamps for Angular 16 Tutorial - Fetch Data Using the provideHttpClient:
Introduction / Project Demo- 00:00
00:45 Generate a new Standalone app in Angular 16
01:50 Generate an Angular service
02:25 Configuration for the provideHttpClient
03:42 Intergate the JSON Placeholder REST API
07:25 Consume the REST API
10:26 Display Data in a table
12:20 Outro
Checkout my MEAN Stack course on Educative:
https://www.educative.io/courses/building-a-full-stack-application-using-the-mean-stack
Support the channel:
https://www.buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
For more resources on Web Development:
https://thecodeangle.com/
Follow Me on Twitter:
https://twitter.com/thecodeangle
Leave a like and subscribe for more videos.
Thanks a lot for watching ❤[+] Show More
The provideHttpClient() API is the ...way to go if you work with module-less Angular applications and don’t want to use NgModule.
This tutorial provides a step-by-step guide on how to integrate the provideHttpClient() into your module-less, standalone application with no skipped steps.
At the end of the tutorial, we will consume the JSON Placeholder REST API to ensure our integrations work perfectly.
Timestamps for Angular 16 Tutorial - Fetch Data Using the provideHttpClient:
Introduction / Project Demo- 00:00
00:45 Generate a new Standalone app in Angular 16
01:50 Generate an Angular service
02:25 Configuration for the provideHttpClient
03:42 Intergate the JSON Placeholder REST API
07:25 Consume the REST API
10:26 Display Data in a table
12:20 Outro
Checkout my MEAN Stack course on Educative:
https://www.educative.io/courses/building-a-full-stack-application-using-the-mean-stack
Support the channel:
https://www.buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
For more resources on Web Development:
https://thecodeangle.com/
Follow Me on Twitter:
https://twitter.com/thecodeangle
Leave a like and subscribe for more videos.
Thanks a lot for watching ❤[+] Show More

active
How to Connect Your Domain Name to Your WordPress Website on Go High Level
In this tutorial, I will show you how to configure your Domain name in ...
In this tutorial, I will show you how to configure your Domain name in Go High Level.
I'll show you how to purchase a domain, and also how to configure ...the A record and TXT record required for your domain name to reflect on your WordPress website.
Chapters on How to Connect Your Domain Name to Your WordPress Website on Go High Level:
0:00 Introduction
01:15 Purchasing a Domain
05:35 Adding the Domain on Go High Level
05:50 Adding the A record and TXT Record
07:00 Verifying the Records
09:45 Outro
✔️ HighLevel 14-Day Free Trial: https://www.gohighlevel.com/?fp_ref=thecodeangle[+] Show More
I'll show you how to purchase a domain, and also how to configure ...the A record and TXT record required for your domain name to reflect on your WordPress website.
Chapters on How to Connect Your Domain Name to Your WordPress Website on Go High Level:
0:00 Introduction
01:15 Purchasing a Domain
05:35 Adding the Domain on Go High Level
05:50 Adding the A record and TXT Record
07:00 Verifying the Records
09:45 Outro
✔️ HighLevel 14-Day Free Trial: https://www.gohighlevel.com/?fp_ref=thecodeangle[+] Show More

active
How to Migrate Your WordPress Website into Go High Level
In this tutorial, I will show you how to migrate your WordPress ...
In this tutorial, I will show you how to migrate your WordPress website into Go High Level.
I'll show you how to export your existing WordPress website and then import ...the website into the GoHighLevel dashboard. After watching this video, your WordPress site will be up and running on Go High Level.
Chapters on How to Migrate Your WordPress Website into Go High Level:
0:00 Introduction
01:39 Breaking down the Go High-Level dashboard
05:09 Exporting the external WordPress website
08:07 Importing the WordPress Website Into Go High Level
09:43 Outro
✔️ HighLevel 14-Day Free Trial: https://www.gohighlevel.com/?fp_ref=thecodeangle[+] Show More
I'll show you how to export your existing WordPress website and then import ...the website into the GoHighLevel dashboard. After watching this video, your WordPress site will be up and running on Go High Level.
Chapters on How to Migrate Your WordPress Website into Go High Level:
0:00 Introduction
01:39 Breaking down the Go High-Level dashboard
05:09 Exporting the external WordPress website
08:07 Importing the WordPress Website Into Go High Level
09:43 Outro
✔️ HighLevel 14-Day Free Trial: https://www.gohighlevel.com/?fp_ref=thecodeangle[+] Show More

active
Angular 16 Tutorial | 3 Important Angular CLI Commands
In this Angular 16 version tutorial, we will learn about some ...
In this Angular 16 version tutorial, we will learn about some important commands of Angular as well as how to use the Angular cli which means the (Command-line Interface) ...in Angular 16. This tutorial keeps you up to speed with some of the latest changes in Angular 16
Timestamps for Angular 16 Tutorial | 3 Important Angular CLI Commands:
Introduction / Project Demo- 00:00
00:21 Generating a standalone component
01:55 Environment variable command
02:40 Inline style and inline template command
05:15 Outro
Checkout my MEAN Stack course on Educative:
https://www.educative.io/courses/building-a-full-stack-application-using-the-mean-stack
Support the channel:
https://www.buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
For more resources on Web Development:
https://thecodeangle.com/
Follow Me on Twitter:
https://twitter.com/thecodeangle
Leave a like and subscribe for more videos.
Thanks a lot for watching ❤[+] Show More
Timestamps for Angular 16 Tutorial | 3 Important Angular CLI Commands:
Introduction / Project Demo- 00:00
00:21 Generating a standalone component
01:55 Environment variable command
02:40 Inline style and inline template command
05:15 Outro
Checkout my MEAN Stack course on Educative:
https://www.educative.io/courses/building-a-full-stack-application-using-the-mean-stack
Support the channel:
https://www.buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
For more resources on Web Development:
https://thecodeangle.com/
Follow Me on Twitter:
https://twitter.com/thecodeangle
Leave a like and subscribe for more videos.
Thanks a lot for watching ❤[+] Show More
![How to Easily Install WordPress Locally on Your Machine (A Practical Guide for Beginners) [2023]](https://i.ytimg.com/vi/ZWc_7gxjEY4/mqdefault.jpg)
active
How to Easily Install WordPress Locally on Your Machine (A Practical Guide for Beginners) [2023]
In This Tutorial, We will learn How to install WordPress on our local ...
In This Tutorial, We will learn How to install WordPress on our local machine by using a virtual machine. We will do this through a platform called Bitnami.
We will ...install WordPress locally by installing the virtual box software and downloading the virtual machine for WordPress packaged by Bitnami.
This video will show you one of the easiest ways to install WordPress locally on your computer, without having to pay for hosting or a domain name!
🎬 𝗧𝗮𝗯𝗹𝗲 𝗼𝗳 𝗖𝗼𝗻𝘁𝗲𝗻𝘁𝘀 on How to Easily Install WordPress Locally on Your Machine (A Practical Guide for Beginners) [2023] 0:00 Intro
01:41 Download Virtual Machine for WordPress
03:22 Install Virtual Box
13:08 Outro
Support the channel:
buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
Follow on Social ♥♥♥♥♥♥
https://twitter.com/thecodeangle
https://github.com/desoga10
https://dev.to/desoga[+] Show More
We will ...install WordPress locally by installing the virtual box software and downloading the virtual machine for WordPress packaged by Bitnami.
This video will show you one of the easiest ways to install WordPress locally on your computer, without having to pay for hosting or a domain name!
🎬 𝗧𝗮𝗯𝗹𝗲 𝗼𝗳 𝗖𝗼𝗻𝘁𝗲𝗻𝘁𝘀 on How to Easily Install WordPress Locally on Your Machine (A Practical Guide for Beginners) [2023] 0:00 Intro
01:41 Download Virtual Machine for WordPress
03:22 Install Virtual Box
13:08 Outro
Support the channel:
buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
Follow on Social ♥♥♥♥♥♥
https://twitter.com/thecodeangle
https://github.com/desoga10
https://dev.to/desoga[+] Show More

active
How to Deploy a MEAN (Angular & Node.js) Stack Application using Render and Netlify
In this tutorial, we are going to set up and deploy a MEAN(MongoDB, ...
In this tutorial, we are going to set up and deploy a MEAN(MongoDB, Express.js, Angular, Node.js) Stack web application from scratch using Netlify for the frontend deployment and Render for ...the backend deployment.
Netlify is a cloud computing company that offers a development platform that includes building, deploying, and serverless backend services for web applications and dynamic websites.
Render is a unified cloud to build and run all your apps and websites with free TLS certificates, a global CDN, DDoS protection, private networks, and auto deploys from Git.
Timestamps for How to Deploy a MEAN (Angular & Node.js) Stack Application using Render and Netlify:
Introduction - 00:00
01:39 - Hosting the backend on Render
07:10 - Hosting the frontend on Netlify
18:39 - Conclusion
Checkout my New MEAN Stack Interactive Course on Educative Inc. :
https://www.educative.io/courses/building-a-full-stack-application-using-the-mean-stack
GitHub Repo for Frontend:
https://github.com/desoga10/Avatar-MEAN--frontend
GitHub Repo for Backend:
https://github.com/desoga10/Avatar-MEAN--backend
Support the channel:
buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle[+] Show More
Netlify is a cloud computing company that offers a development platform that includes building, deploying, and serverless backend services for web applications and dynamic websites.
Render is a unified cloud to build and run all your apps and websites with free TLS certificates, a global CDN, DDoS protection, private networks, and auto deploys from Git.
Timestamps for How to Deploy a MEAN (Angular & Node.js) Stack Application using Render and Netlify:
Introduction - 00:00
01:39 - Hosting the backend on Render
07:10 - Hosting the frontend on Netlify
18:39 - Conclusion
Checkout my New MEAN Stack Interactive Course on Educative Inc. :
https://www.educative.io/courses/building-a-full-stack-application-using-the-mean-stack
GitHub Repo for Frontend:
https://github.com/desoga10/Avatar-MEAN--frontend
GitHub Repo for Backend:
https://github.com/desoga10/Avatar-MEAN--backend
Support the channel:
buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle[+] Show More

active
Build an Avatar Gallery App using the MEAN Stack and Cloudinary | MongoDB, Express, Angular, Node.js
This is full Stack Web Development Tutorial made for Absolute ...
This is full Stack Web Development Tutorial made for Absolute Beginners in 2023. In this tutorial, we made use of different JavaScript technologies like MongoDB, Express.js, Angular, and Node to ...create an Avatar uploads application. The combination of these technologies is regarded as the MEAN stack.
We also made use of a service called Cloudinary to save our image. At the end of this tutorial, you should have a fundamental knowledge of how to create a full-stack application using the MEAN Stack.
Timestamps for Avatar Upload Application using the MEAN Stack and Cloudinary:
Project Demo- 00:00
05:11 - What is the Mean Stack?
09:04 - Creating a New Angular Project
10:50 - Boostrap 5
11:45 - Angular Components
14:05 - Navbar
16:50 - UI Design
18:45 - Angular Router Configuration
22:20 - Creating the Backend Project
23:25 - Installing the npm Packages
25:35 - Creating the Project Structure
27:00 - MongoDB Atlas setup
38:00 - Connecting to MongoDB Using Mongoose
43:45 - Configuring the Model
47:30 - Cloudinary Configuration
52:40 - Creating the Multer Middleware
58:40 - Creating REST API routes with Express
1:39:20 - Creating the Angular models
1:42:38 - Angular Services
1:43:45 - Consy=uming the REST APIs
2:38:35 - Conclusion
Checkout my New MEAN Stack Interactive Course on Educative Inc. :
https://www.educative.io/courses/building-a-full-stack-application-using-the-mean-stack
GitHub Repo for Frontend:
https://github.com/desoga10/Avatar-MEAN--frontend
GitHub Repo for Backend:
https://github.com/desoga10/Avatar-MEAN--backend
Support the channel:
buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
For more resources on Web Development:
https://thecodeangle.com/
Follow Me on Twitter:
https://twitter.com/thecodeangle
Leave a like and subscribe for more videos.
Thanks a lot for watching ❤[+] Show More
We also made use of a service called Cloudinary to save our image. At the end of this tutorial, you should have a fundamental knowledge of how to create a full-stack application using the MEAN Stack.
Timestamps for Avatar Upload Application using the MEAN Stack and Cloudinary:
Project Demo- 00:00
05:11 - What is the Mean Stack?
09:04 - Creating a New Angular Project
10:50 - Boostrap 5
11:45 - Angular Components
14:05 - Navbar
16:50 - UI Design
18:45 - Angular Router Configuration
22:20 - Creating the Backend Project
23:25 - Installing the npm Packages
25:35 - Creating the Project Structure
27:00 - MongoDB Atlas setup
38:00 - Connecting to MongoDB Using Mongoose
43:45 - Configuring the Model
47:30 - Cloudinary Configuration
52:40 - Creating the Multer Middleware
58:40 - Creating REST API routes with Express
1:39:20 - Creating the Angular models
1:42:38 - Angular Services
1:43:45 - Consy=uming the REST APIs
2:38:35 - Conclusion
Checkout my New MEAN Stack Interactive Course on Educative Inc. :
https://www.educative.io/courses/building-a-full-stack-application-using-the-mean-stack
GitHub Repo for Frontend:
https://github.com/desoga10/Avatar-MEAN--frontend
GitHub Repo for Backend:
https://github.com/desoga10/Avatar-MEAN--backend
Support the channel:
buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
For more resources on Web Development:
https://thecodeangle.com/
Follow Me on Twitter:
https://twitter.com/thecodeangle
Leave a like and subscribe for more videos.
Thanks a lot for watching ❤[+] Show More

active
Live FIFA World Cup Score Application, with React and Axios | Using Rapid API
Live FIFA World Cup Score Application, with React and Axios | Using ...
Live FIFA World Cup Score Application, with React and Axios | Using the Rapid API
In this video, we are going to learn how to make a FIFA World Cup Score ...Application using react js step by step with no step skipped. We will make use of the Rapid API platform to set up our REST API, while also making use of Axios to consume the REST API. Basically, we will learn how to:
+ Set up environmental variables in React
+ Consume a REST API in React using Axios
+ Make use of Hooks in React
+ Integrate query parameters in a REST API
Timestamps
Introduction / Project Demo- 00:00
02:52 - Create a new React project
05:-05 - Integrating the UI
06:22 - Installation of necessary packages
07:02 - Set up the REST API using Rapid API
10:55 - Consume the REST API
24:24 - Integrate React Date Picker
34:55 - Outro
GitHub Repo:
https://github.com/desoga10/world-cup-scores
Rapid API FIFA 2022 Schedule and Stats Documentation:
https://rapidapi.com/kwik-api-kwik-api-default/api/fifa-2022-schedule-and-stats
Support the channel:
https://www.buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
For more resources on Web Development:
https://thecodeangle.com/
Follow Me on Twitter:
https://twitter.com/thecodeangle
Leave a like and subscribe for more videos.
Thanks a lot for watching ❤[+] Show More
In this video, we are going to learn how to make a FIFA World Cup Score ...Application using react js step by step with no step skipped. We will make use of the Rapid API platform to set up our REST API, while also making use of Axios to consume the REST API. Basically, we will learn how to:
+ Set up environmental variables in React
+ Consume a REST API in React using Axios
+ Make use of Hooks in React
+ Integrate query parameters in a REST API
Timestamps
Introduction / Project Demo- 00:00
02:52 - Create a new React project
05:-05 - Integrating the UI
06:22 - Installation of necessary packages
07:02 - Set up the REST API using Rapid API
10:55 - Consume the REST API
24:24 - Integrate React Date Picker
34:55 - Outro
GitHub Repo:
https://github.com/desoga10/world-cup-scores
Rapid API FIFA 2022 Schedule and Stats Documentation:
https://rapidapi.com/kwik-api-kwik-api-default/api/fifa-2022-schedule-and-stats
Support the channel:
https://www.buymeacoffee.com/thecodeangle
Join my telegram community:
https://t.me/thecodeangle
For more resources on Web Development:
https://thecodeangle.com/
Follow Me on Twitter:
https://twitter.com/thecodeangle
Leave a like and subscribe for more videos.
Thanks a lot for watching ❤[+] Show More
Load More