English | MP4 | AVC 1920×1080 | AAC 44KHz 2ch | 103 Lessons (20h 35m) | 6.12 GB
Everything you need to know to build a modern web application.
This course is designed to teach you everything you need to know to build to a custom full stack web application.
We’ll start from scratch. That’s right, no starter files! We’ll take it one step at a time as we build the frontend and backend. We’ll explore topics like authentication, accepting payments, relational databases, testing, and automatic deployment.
What you’ll build
The Dollar Holler is a full stack application that creates and manages client invoices. Users will be able to login, create an invoice, and send it to a client. A client will be able to download a PDF of the invoice, as well as, remit payment online.
Topics we’ll cover:
- Search
- Relational Data
- Stripe Integration
- Sending Email
- Testing
- Client Side Fetching
- Deployment
- Hosting
- Custom Fields
- Pagination
- State Management
- Styling
- Animations
- Page Transitions
- Templating
- Creating an API
- E2E Testing
- Svelte (Doh!)
- Sveltekit
- Database Setup
- Visual Testing
- Github Actions
- Real World Git
- User Management
- Forms
- Dynamic Pages
- Components
- Authentication
Who is this for?
- People who want to build a web application from scratch.
- Web developers who want to get better at JavaScript. You don’t need to be a JavaScript expert, but you do need to be comfortable with the language: writing variables, arrow functions, and promises.
- You don’t need to be a CSS Wizard, but you do need to understand the basic principles of CSS.
- This course doesn’t require any prior knowledge of backend development, Node, or database management. We’ve got you covered.
- People curious about Svelte. (Spoiler Alert: It’s awesome!)
Table of Contents
1 Introduction
2 App Review
3 Tooling
4 Installing SvelteKit
5 Installing Tailwind
6 Linting
7 Custom Theme Elements
8 Intro to Routes
9 Intro to Layouts
10 Creating Aliases
11 Dashboard Layout
12 Setting up a Current Path Navigation
13 Responsive Pass on the Dashboard Layout
14 Styling the Invoice List
15 Responsive Invoice List
16 Global Types
17 Seed Data and Stores
18 Invoice Total
19 Dates and Money
20 Additional Options
21 Page States on the Invoice List
22 Portal
23 Styling the Confirmation Message
24 Slide Out Panel
25 Invoice Form
26 Invoice Line Item
27 Add or Remove Line Items
28 Smart Line Items
29 Subtotal, Discount, and Total
30 Add Client Inline
31 Seeding Clients
32 Form Validation
33 Additional Validation
34 Add an Invoice
35 Edit an Invoice
36 Clean Code and Bug Squashing
37 Responsive Invoice Form
38 Snackbar Message
39 Individual Invoice Page
40 Styling the Individual Invoice Page
41 Making the Individual Invoice Dynamic
42 Updating Settings
43 Parsing Markdown on our Individual Invoice page
44 Setting up the Print Invoice Functionality
45 Setting up the Copy Link Button
46 Responsive Pass on the Individual Invoice Page
47 Setting up a Print Stylesheet
48 Thanks for Paying Page
49 Styling the Error Page
50 Styling the Client List Page
51 Adjusting Client List for Mobile
52 Determining the Received and Balance for Each Client
53 Styling the Blank Client State
54 New Client Slide Out Panel
55 Edit a Client Slide Out Panel
56 Styling the Individual Client Page
57 Calculating the Individual Client Page Fields
58 Styling the Settings
59 Styling the Login
60 Styling the Logout _ Alert component
61 Styling the Forgot Password _ Sign Up Pages _ Reset Password
62 Animating the Search Input field
63 Animating the Slide out Panel (New Invoice and New Client)
64 Creating a Page Transition to View an Invoice
65 Click Outside the Additional Options
66 Additional Options for Mobile
67 Action Buttons
68 Cancel
69 Additional Options for Mobile
70 Touch
71 Additional Options for a Client
72 Set up Supabase
73 env Variables
74 Data Modeling
75 Invoice Line Items
76 Client Table
77 Settings Table
78 Handling Relationships
79 User Relationships
80 Populating the Database with Data
81 Displaying Invoices
82 Displaying Clients
83 Adding a Client
84 Adding an Invoice
85 Edit a Client
86 Edit an Invoice
87 Deleting Invoices
88 Delete a Client
89 Search Invoices
90 Search Clients
91 Sign-Up
92 Login
93 Handling the Logout
94 Client Side Auth
95 Server Side Authentication
96 Forgot Password
97 Update Password
98 Row Level Security
99 Individual Client and Individual Invoice Page Bug
100 Displaying the Settings
101 Editing the Settings
102 Upgrading SvelteKit
103 Using Figma
Resolve the captcha to access the links!