SASS:

  • CSS changes the style of your webpage
  • SCSS better for complex styling and working in projects with multiple pages with lots of customization

  • Modular SCSS:

    • Each piece (module) focuses on a specific part
    • separate folders for different types of styles, so your code is more organized and manageable.

  • Operators:

    • (+,-,*,/) use use to dynamically adjust sizes, position, or other sytle properties based on certain conditions or user interactions.

  • Conditional Statements:

    • @if, @else, and @else if allow developers to apply different styles based on conditions.

  • Loops:

    • @for and @each, enable developers to iterate through lists of values or apply styles multiple times.

  • Functions:

    • Functions in SASS enable developers to encapsulate complex logic and calculations. This is valuable for creating dynamic styles that respond to various inputs or conditions

Python/Flask

  • SQLAlchemy: Python tool for interacting with SQL database
  • structure for database table in models
  • uses ./migrate.sh to initilize changes to your databse
  • Flask app object: The Flask app object represents the core of a Flask web application. It is created using the Flask() constructor and serves as the central point for configuring the application, defining routes, and managing various components.
  • SQLAlchemy (SQLA) db object: The SQLAlchemy db object is an instance of the SQLAlchemy class, acting as a bridge between a Flask application and the database. It simplifies database interactions by allowing developers to work with Python objects as if they were database entities, providing a high-level interface for tasks like defining models and performing queries.
  • Use db.create_all() for table initialization. Comment on the process.

  • Intergrating Flask with SQL:

     from flask import Flask
 from flask_sqlalchemy import SQLAlchemy

 app = Flask(name)
 app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///site.db'
 db = SQLAlchemy(app)

  • Create(Inserting Data):

     @app.route('/add_user', methods=['POST'])
 def add_user():
     username = request.form['username']
     password = request.form['password']
     new_user = User(username=username, password=password)
     db.session.add(new_user)
     db.session.commit()
     return 'User added'

  • Read data:

     @app.route('/users')
 def users():
     users = User.query.all()
     return render_template('users.html', users=users)
 Update and Delete: Similar structure to Create and Read, with appropriate SQL commands.
 Building a User Registration Form
 HTML Form:
 html
 Copy code
 <form action="/add_user" method="post">
     <input type="text" name="username" placeholder="Username">
     <input type="password" name="password" placeholder="Password">
     <input type="submit" value="Register">
 </form>

JWT implementation

  • JWT: json web token; Compact, URL-safe means of representing claims between two parties - Commonly used for authentication and information exchange in web development
  • Compact, URL-safe means of representing claims between two parties - Commonly used for authentication and information exchange in web development
  • HTTP Cookies: pieces of information/data that a web server sends to a user’s browser and are stored on a user’s device
  • Relation to Cookies → session Token is sent with each subsequent request from client to server, typically in the form of an HTTP Cookie
  • Authentication → with JWT, the server verifies a signature given to the JWT to ensure authenticity and bases the user’s authenticity based on whether or not the signature is valid therefore trusted