Collections
From VSCode using SQLite3 Editor, show your unique collection/table in database, display rows and columns in the table of the SQLite database.
As shown below, a screenshot that shows the table in database while it’s displays as rows and columns in the table of the SQLite database.
From VSCode model, show your unique code that was created to initialize table and create test data.
This code below is all about making sure our Flask app runs smoothly. It help us keep things fresh by preventing caching, manages user sessions securely, and ensures that only logged-in folks can access certain parts of our app, using tokens and a trusty SQLite database, etc…
This function is linked to the ‘leaderboard’ route in our Flask app which handles incoming POST requests from the frontend. It extracts data like user ID and points to add from a JSON payload. And then, it connects to a SQLite database, retrieves the user’s current points, updates them with the provided points, and commits the changes. Finally, it responds with a JSON message confirming the successful leaderboard update.
This function sets up test data for user profiles and notes in our Flask app, and creating a SQLite database and tables if it’s needed. It generates sample user profiles with names, IDs, passwords, birthdates, job info, and roles, etc… along with random notes associated with each user.
This codes sets up a User class for managing data in the ‘users’ table using SQLAlchemy ORM. It defines attributes like name, ID, password, birthdate, job details, and role, etc… It also establishes a relationship between users and their posts, allowing for easy management. The constructor initializes User objects with provided data, setting defaults as needed.
Lists and Dictionaries
Here is an example of a list. This code ensures that requests are only allowed from specific origins listed in the predefined list. If a request comes from an allowed origin, the CORS policy is adjusted to allow requests from that origin. So, when I set a breakpoint to this code and run our song picker, the code fails. Once these key values are removed, the code fails to function, and the backend breaks down.
Here’s another instance of a similar situation can be seen in:
APIs and JSON
This can be seen in the register function. This piece of code manages user registration, so when someone tries to register, it checks if they provided a username, password, and confirmation. If any of these are missing, it tells them to fill them in. If everything is provided, it checks if the username is already taken. If not, it adds the new user to the system. If the username is already taken, it tells the user to pick a different one.
In VSCode, show algorithmic conditions used to validate data on a POST condition.
####
In Postman, show URL request and Body requirements for GET, POST, and UPDATE methods.
The potentiall reason for this to fail for GET Method is that it might be the URL might be wrong or the server might be down or there could be internet connection issues.
The potentiall reason for this to fail for POST Method is that the URL might be incorrect or unreachable, the request body could be missing necessary info or improperly formatted or that the authorization might be required but not provided.
The potentiall reason for this fail for UPDATE Methoad is that the URL might be wrong or inaccessible, or the request body might lack crucial details or be incorrectly structured, or the user ID provided might not exist.
In Postman, show the JSON response data for 200 success conditions on GET, POST, and UPDATE methods.
The postman might fail in this circumstances might be the server issues or the misconfiguration that it could lead to an wrong response, or it’s because the Postman might struggle to interpret the response if it’s not in the expected format.
In Postman, show the JSON response for error for 400 when missing body on a POST request.
The postman might fail in this circumstances might because that postman might not understand the error message if it’s not clear or not in the correct format…
In Postman, show the JSON response for error for 404 when providing an unknown user ID to a UPDATE request.
It might not go through because if the error message is vague or not properly formatted, Postman might struggle to interpret it.
Frontend
Blog JavaScript API fetch code and formatting code to display JSON.
In Chrome inspect, show response of JSON objects from fetch of GET, POST, and UPDATE methods. Code breaking in login
In the Chrome browser, show a demo (GET) of obtaining an Array of JSON objects that are formatted into the browsers screen.
Below is how all the objects in squares…
In JavaScript code, describe fetch and method that obtained the Array of JSON objects.
- At the top
- First, we send a request to the website’s address, asking for a list of songs.
- Then, we gather that list and go through it, making a special section for each song.
- At the bottom
- This part is just to show how we make those sections using a tool called JQuery.
- We start by making a box, and inside it, we put a picture and a little symbol that you can click on.
In the Chrome browser, show a demo (POST or UPDATE) gathering and sending input and receiving a response that show update. Repeat this demo showing both success and failure.
In JavaScript code, show and describe code that handles success. Describe how code shows success to the user in the Chrome Browser screen.
- If the backend manages to add the text to the image, the frontend will show the song blocks, letting you know it worked.
- You’ll also be able to play the songs.
In JavaScript code, show and describe code that handles failure. Describe how the code shows failure to the user in the Chrome Browser screen
- If there’s an issue with the API, you’ll get an alert with the error from the backend.