Gain insights into developing web applications using Flask, a lightweight and easy-to-learn Python framework. Delve into techniques that make you a sought-after full-stack developer.

flaskw.tar.gz

flask

flask - code widget

flask sqlalchemy terminal

flask2

flask3

flask4

flask5

This project-based course is a detailed guide to web application development using the increasingly popular Flask framework.

Flask is known for being simple, lightweight and having a small learning curve. If you've got some experience in Python, picking up Flask will be a breeze. It's got a booming job market and will put you on track to becoming an in-demand full-stack developer. What's not to love?

Flask: Develop Web Applications in Python

"""Flask Application for Paws Rescue Center."""
from flask import Flask, render_template, abort
from forms import SignUpForm

app = Flask(__name__)
app.config['SECRET_KEY'] = 'dfewfew123213rwdsgert34tgfd1234trgf'

"""Information regarding the Pets in the System."""
pets = [
            {"id": 1, "name": "Nelly", "age": "5 weeks", "bio": "I am a tiny kitten rescued by the good people at Paws Rescue Center. I love squeaky toys and cuddles."},
            {"id": 2, "name": "Yuki", "age": "8 months", "bio": "I am a handsome gentle-cat. I like to dress up in bow ties."},
            {"id": 3, "name": "Basker", "age": "1 year", "bio": "I love barking. But, I love my friends more."},
            {"id": 4, "name": "Mr. Furrkins", "age": "5 years", "bio": "Probably napping."}, 
        ]


@app.route("/")
def homepage():
    """View function for Home Page."""
    return render_template("home.html", pets = pets)


@app.route("/about")
def about():
    """View function for About Page."""
    return render_template("about.html")


@app.route("/details/<int:pet_id>")
def pet_details(pet_id):
    """View function for Showing Details of Each Pet.""" 
    pet = next((pet for pet in pets if pet["id"] == pet_id), None) 
    if pet is None: 
        abort(404, description="No Pet was Found with the given ID")
    return render_template("details.html", pet = pet)


@app.route("/signup", methods=["POST", "GET"])
def signup():
    """View function for Showing Details of Each Pet.""" 
    form = SignUpForm()
    return render_template("signup.html", form = form)

if __name__ == "__main__":
    app.run(debug=True, host="0.0.0.0", port=3000)


from flask_wtf import FlaskForm
from wtforms import StringField, PasswordField, SubmitField
from wtforms.validators import InputRequired, Email, EqualTo

class SignUpForm(FlaskForm):
    full_name = StringField('Full Name', validators = [InputRequired()])
    email = StringField('Email',
                        validators = [InputRequired(), Email()])
    password = PasswordField('Password', validators = [InputRequired()])
    confirm_password = PasswordField('Confirm Password',
                                     validators = [InputRequired(), EqualTo('password')])
    submit = SubmitField('Sign Up')


React

Dart

GoJS React

Typescript React

Vue.js

# Explanation
Let's take a look at how we solved this problem.

## Modifications in `forms.py`
In `forms.py`, we created a `SignUpForm` class that inherits from `FlaskForm`.

## Modifications in `app.py`
At **line 38** of `app.py`, we added a view function called `signup`. It is associated with the route `/signup` and accepts both `GET` and `POST` methods. We created an instance of the `SignUpForm` in this function and returned it to the `signup.html` template to render. 
Furthermore, at **line 6**, we also added a `SECRET_KEY` in the application because we know that we will need it for the `csrf_token` later. 

## Modifications in `signup.html`
We have inherited the `signup.html` template form the `base.html` template so that it remains consistent with all other templates in the system. Since we have filled all the placeholders with the appropriate values, we can now render the `form` that we just passed from `app.py`.

## Modifications in `base.html`
To add a navigation bar in all the templates, we used the `base.html` template because all the **commonalities** should be placed in the ***parent template***. In **lines 9 to 15**, we added a simple horizontal list of links using the `<a>` tags within `<li>` tags. The links were generated using the `url_for()` function against the endpoints for the specified view functions.

In this lesson, we will take a look at the solution for rendering a sign-up form using Flask-WTF and also adding a navigation bar to all the templates.

Before Getting Started

Introduction to Flask

First Flask Application

Build File/Directory Explorer in Flask

Static Templates

Static Files

Dynamic Templates

Form Handling

Database

Operations on Models

Conclusion

Test a MEAN Stack Todo Application with JEST

Build an E-Learning Website Using Flask

Solution: Rendering a Sign-Up Form and Navbar

Solution