CF

Build Fullstack Trello clone: WebSocket, Socket IO

8h 49m 48s
English
Paid

In this course we will build a Trello clone API using Angular, Typescript, NodeJS, Express, MongoDB and Socket IO . This course is fully focused on fast and deep dive into creation of fullstack application with this tools. We will start from scratch and step by step you will get close to finished real application. You will deeply understand how to structure your application, build reusable and understandable modules and services and split code into smaller chunks of code.

We will write code together in efficient way to make it pure and avoid data complexity. We will do real time communication by implementing WebSocket with Socket IO.

Our code will be written with Typescript on the backend and on the client.

We will deploy our application to the real production server at the end of the course.

For each lesson you'll get source code of the lesson, so it's easy to see the progress and get a working app on any lesson you want. 

What you will learn in this course:

  • Structure and configure project

  • Write high quality code with Typescript on real project

  • Create reusable modules, controllers and services

  • Implementing authentication both in http and in websockets

  • Deeply understand Angular & Express design patterns

No prior knowledge except of Javascript is needed (because I will teach you everything from basics) but if you have experience with any of this  (Angular/Express/Typescript/MongoDB/Socket io) it will be easier for you to go through this course.

If you are feeling like you learned web but you still still missing knowledge of how to build your own real application this course is what you need. 

About the Author: Udemy

Udemy thumbnail

Udemy is the largest open marketplace for online courses on the internet. Founded in 2010 by Eren Bali, Oktay Caglar, and Gagan Biyani and headquartered in San Francisco, the company went public on the Nasdaq in 2021 under the ticker UDMY. The platform hosts well over two hundred thousand courses across software development, IT and cloud, data science, design, business, marketing, and creative skills, taught by tens of thousands of independent instructors. Roughly seventy million learners use it worldwide, and the corporate arm — Udemy Business — supplies a curated subset of that catalog to enterprise customers.

Because Udemy is a marketplace rather than a single editorial publisher, the catalog is uneven by design. The strongest material lives in the long-form, project-based courses authored by working engineers — full-stack JavaScript, React, Node.js, Python data science, AWS, Docker and Kubernetes, mobile development with Flutter and React Native, and cloud certification preparation. The CourseFlix listing under this source is the slice of that catalog that has been mirrored here for offline-friendly viewing, organized by topic and updated as new releases land. Pricing on Udemy itself swings dramatically with the site's near-permanent sales, which is why the platform is best treated as a deep reference catalog: pick instructors with strong reviews and a track record of updating their material rather than buying on the headline price alone.

Watch Online 47 lessons

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 47 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: What technologies do we use?
All Course Lessons (47)
#Lesson TitleDurationAccess
1
What technologies do we use? Demo
03:34
2
Downloadable resources
00:41
3
Installing Node & Angular
08:10
4
Configuring server
05:06
5
Installing database
07:28
6
Do you use a good editor?
02:20
7
Setting up socket with Express
11:54
8
Creating Mongoose user model
22:21
9
Adding registration
20:11
10
Implementing login
11:05
11
Creating auth middleware
15:41
12
Creating auth module
19:00
13
Register page - Markup + Form
12:56
14
Register page - service + validation
11:07
15
Login page
10:01
16
Home page
08:14
17
Auth interceptor
08:06
18
Auth guard
13:53
19
Gettings boards
14:16
20
Frontend for gettings boards
10:01
21
Inline form
15:29
22
Implementing creating a board
19:20
23
Adding Top bar and logout
07:39
24
Creating board module
08:59
25
Getting a single board
02:48
26
Adding board stream
06:27
27
Creating socket service
09:56
28
Joining and leaving board
17:20
29
Authentication in socket.io
11:28
30
Getting columns
09:15
31
Create column with websockets
12:15
32
Getting columns
11:38
33
Create column form
15:58
34
Creating a basic task
09:36
35
Getting tasks
11:43
36
Create task form
08:25
37
Update board name
15:28
38
Delete board
08:19
39
Delete column
10:10
40
Update column
08:55
41
Unsubscribe
06:55
42
Task module and basic component
15:55
43
Get task and columns
13:58
44
Update task
14:43
45
Delete task
07:31
46
Deployment
31:30
47
Homework
02:03
Unlock unlimited learning

Get instant access to all 46 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Related courses

Frequently asked questions

What are the prerequisites for enrolling in this course?
Before enrolling, students should have a basic understanding of JavaScript, as the course involves working with Angular and NodeJS, which are built on JavaScript. Familiarity with TypeScript will be helpful, but the course will cover its usage as part of building the application. Knowledge of HTML and CSS is also beneficial for understanding the frontend components.
What will I build by the end of the course?
By the end of the course, you will have built a fullstack Trello clone. This includes implementing features such as user registration, login, board creation, task management, and real-time updates using WebSocket and Socket IO. The application will integrate both frontend and backend components, giving you practical experience in creating a comprehensive web application.
Who is the target audience for this course?
The course is aimed at developers who are interested in building fullstack applications using modern technologies such as Angular, NodeJS, Express, and MongoDB. It is suitable for those who want to learn how to implement real-time features using WebSocket and Socket IO, and who have a fundamental understanding of web development concepts.
How does the depth of this course compare to similar courses?
This course offers a fast-paced, deep dive into building a fullstack application from scratch. It covers both frontend and backend development extensively, including user authentication, real-time data handling, and deployment. Compared to other courses, it provides a comprehensive look at how to integrate various technologies to create a cohesive application.
Does the course cover deployment of the application?
Yes, the course includes a lesson on deployment, where you will learn how to deploy your fullstack Trello clone application. This allows you to understand the complete process from development to making your application available to users, ensuring you gain skills in both building and launching web applications.
What specific tools and platforms are emphasized in the course?
The course emphasizes the use of Angular for the frontend and NodeJS with Express for the backend. It also covers the integration of MongoDB for database management and uses Socket IO for real-time functionalities. These tools are crucial for building a responsive and dynamic fullstack application as outlined in the course.
What topics are not covered in this course?
The course does not cover frontend frameworks other than Angular or backend languages other than NodeJS. It focuses specifically on building a Trello clone, so topics like mobile development or other database systems beyond MongoDB are not included. This ensures a concentrated exploration of the selected stack.