Introducing "Dad Jokes: The Ultimate Source of Cheesy Laughter!"
Are you ready to embark on a hilarious journey into the world of dad jokes? Look no further! Our JavaScript Dad Jokes web app is here to tickle your funny bone and leave you in stitches.
Get ready to embrace the sheer delight of cringeworthy humor as you explore an extensive collection of pun-tastic dad jokes. With just a click of a button, our app will serve you a fresh dose of laughter, guaranteed to make you groan and giggle at the same time.
But wait, there's more! Feel like sharing your own gems of comedic genius? Our app allows you to add your very own dad jokes to the ever-expanding repertoire. Spread the laughter and watch as your jokes become part of the delightfully cheesy tapestry of dad humor.
Get ready to laugh!
I built this basic JavaScript app to be used for learning. Feel free to use this repo to get started with JavaScript.
I also used this app in one of my JavaScript courses on Pluralsight. You can find my Pluralsight author profile here: Steve Buchanan on Pluralsight.
The Dad Jokes application follows a traditional client-server architecture:
- Frontend: HTML, Bootstrap CSS, JavaScript
- Backend: Node.js with Express.js
- Database: MySQL
- Authentication: Session-based with password hashing via bcrypt
- User signup and login with secure password hashing (using Bcrypt).
- Add, view, and edit jokes.
- Protected routes for authenticated users.
- Dynamic UI based on authentication state.
- Session management with timeout.
- Secure password storage.
- Configures middleware
- Manages sessions
- Routes requests
- Protects sensitive resources
- Serves static content
- User authentication routes (signup, login, logout)
- CRUD operations for jokes
- Database interactions
- User data (username, email, hashed passwords)
- Joke data (questions, answers, ratings)
- Authentication pages (login, signup)
- Joke display pages
- Navigation elements that adapt to authentication state
- Node.js (v14 or later)
- MySQL database
-
Clone the Repository:
git clone <repository-url> cd dadjokes-main
-
Install Dependencies:
npm install
-
Set Up the Database:
- Create a MySQL database.
- Run the SQL scripts in
setup/createdbandinsertjokes/to set up the database schema and seed data:createDBandJokesTable.sql createUsersTable.sql insertJokes.sql
-
Configure the Database Connection:
- Update the
config/dbinfo.jsfile with your database credentials.
- Update the
-
Run the Application Locally:
npm start
The app will be available at
http://localhost:3000.
- Secure signup with bcrypt password hashing
- Email and username validation
- Success/error feedback
- Credential verification against database
- Session creation on successful authentication
- Redirect to protected content
- Middleware-based authentication checks
- Redirect to login page with error messages
- Protection for specific files/directories
- Express-session for maintaining authentication state
- Configurable session timeout
- Secure cookie handling
- Session destruction
- Redirect to home page
| Operation | Route | Description |
|---|---|---|
| Create | /japi/jokes (POST) |
Adds a new joke |
| Read All | /japi/jokes (GET) |
Returns all jokes |
| Read One | /japi/jokes/:id (GET) |
Returns specific joke |
| Random | /japi/randomjokes (GET) |
Returns random joke |
| Update | /japi/jokes/:id (PUT) |
Edits existing joke |
| Delete | /japi/jokes/:id (DELETE) |
Removes a joke |
CREATE TABLE users (
id INT AUTO_INCREMENT PRIMARY KEY,
username VARCHAR(255) NOT NULL UNIQUE,
email VARCHAR(255) NOT NULL UNIQUE,
hashed_password VARCHAR(255) NOT NULL,
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);CREATE TABLE jokes (
id INT AUTO_INCREMENT PRIMARY KEY,
question TEXT NOT NULL,
answer TEXT NOT NULL,
rating INT DEFAULT 0,
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);- Password Hashing: Uses bcrypt with 10 rounds of salting
- Session Security: Configurable session timeout (30 minutes)
- Access Control: Middleware-based route protection
- Error Handling: Non-revealing error messages for security
- SQL Injection Prevention: Parameterized queries for database operations
I built this basic JavaScript app to be used for learning. Feel free to use this repo to get started with JavaScript.
I also used this app in one of my JavaScript courses on Pluralsight. You can find my Pluralsight author profile here: Steve Buchanan on Pluralsight.
This app consists of:
- HTML
- Bootstrap CSS
- JavaScript
- Node.js
- Express
This app requires a MySQL database. You will need to host the database somewhere. In the repo there are files with SQL code for creating the database, table, and for inserting the jokes. The folder path is dadjokes/setup/createdbandinsertjokes/
- createDBandJokesTable.sql
- createUsersTable.sql
- insertJokes.sql
I have tested two deployment options for deploying this app. These are:
-
This app can be deployed to the free tier on www.render.com with ease using these steps: Deploy a Node Express App to Render.
-
This app can be containerized and deployed with ease to Azure Kubernetes Service (AKS) a cloud managed Kubernetes cluster using these steps here: Automated Deployments for AKS.
-
Note: If you want to run the app locally check out the steps in the dadjokes/setup/runlocally/localbuild.txt file.
- Password Recovery: Implement forgotten password functionality
- Email Verification: Add email verification during signup
- CSRF Protection: Add CSRF tokens for form submissions
- Rate Limiting: Implement API rate limiting for security
- User Profiles: Allow users to manage their profile information
- Remember Me: Add persistent login functionality
- Social Authentication: Integrate with OAuth providers
- Advanced Access Control: Role-based permissions system
- Joke Ownership: Associate jokes with users who created them
- Analytics: Track user interaction and popular jokes
This project is licensed under the MIT License.
Be sure to visit my blog www.buchatech.com to stay up to date on my adventures in tech!
Happy Coding!