0% completed

Introduction

What To Expect From This Course Full Stack Development The Elements of a Web Application FRAP Applications

Basic Client Pages with React

Introduction to React Setting up the React Application A Look at Necessary Files Tinker with the Live React App Making a Collatz Conjecture Application: String Output Making a Collatz Conjecture Application: List Output Working With Fonts

Dynamic Client-Side Pages with React

Practical Advantages of React Creating Input Elements Introduction to Controlled Inputs Further Exploring Controlled Inputs Global State

Server-Side API Creation with Flask

Why Are Rest APIs Good?Conventions for REST APIs Python Flask Servers Python Decorators Flask-RESTPlus Has What You Need Fixing Issues Managing the Configurations: Set Up ENV Variable Managing the configuration: YAML File Creating Scripts

Database Definition and Creation with SQLAlchemy

PostgreSQL vs SQLite Pros and Cons of SQLAlchemy Working With SQLAlchemy SQLAlchemy Data Types Keys in SQLAlchemy Creating Session Using Query Method in the Session Object Using The Query Method: Filter Connecting Multiple Tables From SQLite to PostgreSQL

Code Documentation with Sphinx

Introduction to Sphinx Compile to HTML: Set Up Sphinx Compile to HTML: Important Changes Compile to HTML: Make HTML Get More reST: Making Changes Get More reST: Re-run make HTML Get More reST: Adding Files Some More Features of Sphinx Publish

An Introduction to Code Testing

The Purpose of Code Tests: Clarity of Thought The Purpose of Code Tests: Coding in Small parts The Purpose of Code Tests Unit Testing Recommended Tests Snapshot Testing Making Snapshot Testing Easy Integration, User, and Acceptance Testing

UI Testing

Tools for Testing Jest Testing Your First Test Importing and Exporting items Writing Unit Tests for Our Application Throwing an Error and Testing It Why do we Need Storybook?Making Custom Stories storiesOf() and Placeholders Creating Documentation Snapshot Testing Combining Snapshot Testing and Storybook

API Testing

Interactive Testing: Introduction Interactive Testing: Handling Errors Using Pytest Pytest on Flask: Setting up the Flask App for Testing Pytest on Flask: Performing Tests

Database Integrity Testing

Common Issues with Databases Invalid Semantics Foreign Key Foreign Key: Postgres Constraints Why We Need Integrity Tests Integrity Tests Integrity Tests: pytest

Automatically Testing Every Update

Introduction to Automated Testing Hooking the Test into Git: Requirements Hooking the Test into Git: Working of Git Commands for Testing: React Applications Commands for Testing: Flask Application Commands for Testing: Documentation Commands for Testing: Necessary Details

Design a Web Application

Introduction to Designing Web Application Planning Stories and Interactions for the Application Design the UI Design the API Design the Data Model Finalizing the Design of Data Model

Build the Data Model

Requirements of Data Model Create Tables: Usage Construct User and Game Class Necessary Updates Inspecting the Usage Database Build Postgres Database

Build the REST API

Getting Started with the API of Langman Reaching Out to the Routes and Database DELETE: Remove the Game POST: Starting a Game GET: Seeing Game Status PUT: Guessing a Letter Handling Diacritics Looking into the Database

Build the React Client

The Front-End of Our Application Buttons, Forms, and Panels Button Panel Form Play Again Panel Screen Components Result Banner Usage and Blanks The Gallows Component Gallows Component: Adding the Body Screens: Sign-In Screens: Win Screens: Lose Screens: Play App Component: Overview App Component: Connecting to the Back-end App Component: Changing Screens

Finishing Touches for the App

Play the Game: Error Message

Play the Game: Dealing with the Error

A Quick Look Back

Replace favicon.ico

Compiling the Documentation

Creating Some Tests: Approaches

Creating Some Tests: Things to Check

Creating Some Tests: Additional Functions

Creating Some Tests: Checking the Guesses

Creating Some Tests: Running Tests

Web Authentication

Introduction to Web Authentication The Role of Data Signatures JWT: JSON Web Tokens Creating the Authentication Table Necessary Changes for Creating the Authentication API Creating the Authentication API Looking Inside a JSON Web Token Necessary Changes for Updating the Langman API The Langman API Steps to Update the Langman API Updating the Client: The Login Screen Updating the Client: Functions Updating the Client: `flashMessage` Component

Deploy the Application

Introduction to Heroku Installing and Configuring Heroku Create Heroku Application Prepare the Environment to Support the Database Configure the Production Server Configure the Proxy Server Deploy the Application Deploy the Application Yourself

Conclusion

Coding Efficiently Three Pillars of Web Application Development Lessons Learned: Shortening the Feedback loop Lesson Learned: Design Approach What To Do Next

Appendix

Proficient Tool Use Language Fluency Python REPL and Environment Manager Preparing Your Virtual Environment: pipenv Preparing your Virtual Environment: Pipfile Installation of PostgreSQL

...

/

A Quick Look Back

A Quick Look Back

Get to know a summary of what we have and haven't accomplished so far.

Speed-ups

Let’s take a moment to appreciate all of the speed-ups that we’ve taken advantage of.

The creation of the React application was a simple one-line command. There was no need to worry about the underlying technologies like Webpack. The creation of the components was then sped up by getting to instantaneously see how they look, tweak them, and combine them.
Without Storybook, testing the various screens that the application can render would require laborious interactive testing

...

Access this course and 1400+ top-rated courses and projects.