Solid JS Firebase The Complete Guide for Twitter Clone

Solid JS & Firebase – The Complete Guide for Twitter Clone, available at $69.99, has an average rating of 4.35, with 217 lectures, 32 quizzes, based on 49 reviews, and has 676 subscribers.

You will learn about Learn to program with Solid JS and create amazing Web Apps Get an understanding of how to create a Twitter clone app explained practically Write type-safe code with Typescript Use Firebase services – Firestore storage, Authentication Establish yourself in the field of the Web Development This course is ideal for individuals who are Anybody interested in how to create Web Apps with modern JS libraries/frameworks or People looking for a practical web development guide or This course is for everyone eager to understand how to build an app from scratch It is particularly useful for Anybody interested in how to create Web Apps with modern JS libraries/frameworks or People looking for a practical web development guide or This course is for everyone eager to understand how to build an app from scratch.

Enroll now: Solid JS & Firebase – The Complete Guide for Twitter Clone

Summary

Title: Solid JS & Firebase – The Complete Guide for Twitter Clone

Price: $69.99

Average Rating: 4.35

Number of Lectures: 217

Number of Quizzes: 32

Number of Published Lectures: 217

Number of Published Quizzes: 32

Number of Curriculum Items: 249

Number of Published Curriculum Objects: 249

Original Price: $139.99

Quality Status: approved

Status: Live

What You Will Learn

Learn to program with Solid JS and create amazing Web Apps

Get an understanding of how to create a Twitter clone app explained practically

Write type-safe code with Typescript

Use Firebase services – Firestore storage, Authentication

Establish yourself in the field of the Web Development

Who Should Attend

Anybody interested in how to create Web Apps with modern JS libraries/frameworks

People looking for a practical web development guide

This course is for everyone eager to understand how to build an app from scratch

Target Audiences

Anybody interested in how to create Web Apps with modern JS libraries/frameworks

People looking for a practical web development guide

This course is for everyone eager to understand how to build an app from scratch

Is this course right for you?

This course covers creating a Twitter-like application with Solid JS and minimal 3rd party dependencies. Almost every feature is made from scratch without any dependency package. This covers – Form Validation, Pagination, Modal, Popups, Snackbar,and more.

The course covers the explanation of Solid JS library API by working on an actual project. This course will give you the confidence and skills required to start any project.

Students should have basic javascript knowledge to start working on this course.

What is Solid JS?

Solid JS is a reactive UI library inspired by React JS. It utilizes Component-like architecture, reactive data binding, and JSX.

Every Component executes once, and the Hooks and bindings execute many times as their dependencies update.

Solid follows the same philosophy as React with unidirectional data flow, read/write segregation, and immutable interfaces. It, however, has an entirely different implementation that forgoes using a Virtual DOM.

What is Typescript?

TypeScript is an open-source language that builds on JavaScript, one of the world’s most used tools, by adding static type definitions.

What are you going to work on?

Students will build a Twitter-like app from scratch – the HTML layout part is not part of the course (This will be provided in the course materials to save time and focus purely on Solid JS). The focus of this course is coding and not writing HTML content.

You will learn how to use Typescript language – a superset of Javascript providing additional features and a static type checker.

The course starts with the preparation of the base layout of the application. All designs – images, and content are provided by the instructor.

Content can be briefly summarized in these points:

Layout preparation – A few lectures to prepare the HTML for your application. Separation of layout into the Solid JS components.

Solid JS Router – This part explains how to create a “multi-page” application. Students will learn how to create a routing with different routing strategies and navigation to the routes. Covers the creation of Profile, Login, and Register pages.

Signals & Reactivity – Explains how to create and manage reactive data with createSignal and stores.

Lifecycle function – How to use onMount and onCleanup

Auth Forms – Students will learn how to create a reactive form and bind the data to form inputs.

Custom Form Validation– Covers creating a custom input/form validation and error handling from scratch.

Firebase/Firestore – Initialization of Firebase application (data storage)

Hook Functions – Important part of the projects. Allows the feature-related code to be separated into its context.

Authentication – This part covers creating a login, register, and logout functionality. Students will learn how to authenticate a user upon the application visit.

Provider and Context – This creates a provider component, which can hold the data on the root level and provide them to underlying components.

Snackbars – App-wise functionality created with Provider to display any message as a toast popup.

Glide Creation – Covers how to create a new glide and display it on the main page. From this point on, students will often work with Firebase/Firestore.

Follow Functionality – Follow functionality allows users to subscribe to other users.

Display Glides from Following – Subscription (Following) to other users will allow seeing the Glides (messages) they post.

Paginate Glides – It would be inefficient to fetch/display all of the glides on the initial load. Students will learn how to implement their lazy loaded pagination when data are loaded as the users browse the application.

Create Sub-Glides – It’s essential to have a way to respond to glides. This feature enables a user to create subglides, which is an answer to the glide.

Modal Messenger – Students will learn how to create a modal component from scratch. This will be used to display a messenger component on any page.

Deployment to Vercel – Finally, the application will be live hosted on Vercel. Anybody on the internet will be able to visit your application.

Persistence – This section explains how to store data on the application level and persist them for later use.

While working on the features above, the students will learn and understand Solid JS features. They will know how to architecture applications and will be able to create their applications with Solid JS.

Course Curriculum

Chapter 1: Introduction

Lecture 1: Introduction

Lecture 2: How to resolve issues

Lecture 3: Few words before start

Chapter 2: Init Project

Lecture 1: Init Project

Lecture 2: Open Coding Editors

Lecture 3: Create entry files

Lecture 4: Tailwind css

Lecture 5: Layout

Lecture 6: Init Icons + Popup menu

Lecture 7: Base Layout Done

Chapter 3: Components & Modularity

Lecture 1: Sidebar Components

Lecture 2: Trends Data

Lecture 3: For Loop

Lecture 4: Layouts

Lecture 5: Main Layout

Chapter 4: Reactivity

Lecture 1: Create signal

Lecture 2: Create glide function

Lecture 3: Add more content to the glide

Lecture 4: Glide Post Component

Lecture 5: Pass props to glide post

Lecture 6: Glide Type

Lecture 7: Simplify Getters

Chapter 5: Routing

Lecture 1: Screens

Lecture 2: Login and Register layout

Lecture 3: Routing Changes! Important.

Lecture 4: Next Lecture Router Changes

Lecture 5: Router

Lecture 6: Lazy loading

Lecture 7: Main navigation Links

Lecture 8: A Router Component

Chapter 6: Popup

Lecture 1: Show content conditionally

Lecture 2: Fallback and lifecycle functions

Lecture 3: Simple Popup

Lecture 4: Pass component to Popup

Lecture 5: Improve look of popup

Lecture 6: Create effect

Lecture 7: Adjust popup

Lecture 8: Set popup position

Lecture 9: Close popup on outside click

Lecture 10: Portal

Lecture 11: Resize Event

Lecture 12: Dont close on popup click

Chapter 7: Create Root

Lecture 1: Pagesize createroot

Lecture 2: Track resize

Lecture 3: Display icon conditionally

Lecture 4: Pagesize tracking

Chapter 8: Context and Provider

Lecture 1: Auth Provider – Before you Start

Lecture 2: Auth Provider

Lecture 3: Auth context values

Lecture 4: Stores

Lecture 5: Set Auth State

Lecture 6: Loader

Lecture 7: Display loader conditionally

Lecture 8: Routing Layouts

Lecture 9: Redirects

Chapter 9: Register Form

Lecture 1: Set value in the form

Lecture 2: Function to handle input changes

Lecture 3: Register form type

Lecture 4: useForm hook

Lecture 5: Move functionality to useForm

Lecture 6: Submit Callback

Lecture 7: Generic types

Chapter 10: Validation

Lecture 1: Custom directive

Lecture 2: On Blur, On Input

Lecture 3: Move Validate Out

Lecture 4: Simple validation

Lecture 5: Simple Max length validator

Lecture 6: Max length validator

Lecture 7: Reusable validators

Lecture 8: Run all validators

Lecture 9: First letter uppercase validator

Chapter 11: Validation – part 2

Lecture 1: Produce Function

Lecture 2: Errors Array

Lecture 3: Form error component

Lecture 4: Display error messages

Instructors

Eincode by Filip Jerga
Online Education

Filip Jerga
Software Engineer

Rating Distribution

1 stars: 1 votes

2 stars: 1 votes

3 stars: 2 votes

4 stars: 14 votes

5 stars: 31 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!