Adding more info to the readme, adding test site login chagnes to allow session login without DB, adding sample env.

This commit is contained in:
Bradley 2021-06-04 10:20:23 -07:00
parent a32c394dd9
commit 5c4a2db2ce
5 changed files with 46 additions and 15 deletions

View file

@ -2,13 +2,32 @@
## This is a skeleton template of the wedding website I created
Features include:
- Password login for site access
- RSVP page for groups or individuals
- Pages that include:
- Home Page
- Wedding Party
- Photos pages
- Q&A
- Travel information
- RSVP forms
## Names, Dates, Locations are all hardcoded to a value
The site implements a basic auth to protect access without knowing the password to the site.
The site implements a basic auth with [next-iron-session](https://github.com/vvo/next-iron-session) to protect access without knowing the password to the site.
The code is set up to use a MongoDB instace, ENV MONGO_URL, but this could easily be swapped for any DB. For the purposes of deploying this template for viewing the data is hardcoded.
Use of CSS variables at a Layout level allows for theming and is easily extensible.
Adding, Updating, and Deleting of guests and groups is currently done manually on the DB or on a deployment of the admin specific branch.
This admin branch is not included yet in this example site as no roles or permissions have been set up. However, this branch does include additional pages to add, edit, and delete these guests and groups.
## Tech
Overall a typical NextJS Application
Overall a typical NextJS Application using ReactJS and basic authentication.
### Frontend
@ -23,5 +42,13 @@ Overall a typical NextJS Application
- NextJS APIs
- Next Iron Session for Login
- Server side rendering of base pages checking to see if user is logged in
- Requires ENV variable of SECRET_COOKIE_PASSWORD to be set
- Mongoose DB for MongoDB
- Used to store RSVPs and default login
- Used to store RSVPs and default logins
## Future Changes
1. On/Off feature for public vs password protected sites
2. Build in auth permissions to allow guest vs admin roles
3. If roles available then add in the admin pages for create, update, and deletion of guests/groups
4. Add more theming options and easy customization of pages, resources, etc.
5. Email reminder option

View file

@ -136,6 +136,7 @@ const Login = () => {
>
{errorMsg && <p className="error">Error: {errorMsg}</p>}
<fieldset aria-busy={loading} disabled={loading}>
<span>Temp password is "weddingsite". PLEASE CHANGE FOR YOUR PRODUCTION SITE!</span>
<label htmlFor="username">
<span>Username</span>
<input

View file

@ -12,6 +12,15 @@ export default withSession(async (req, res) => {
try {
if (username && password && penguin && penguin === 'penguin') {
let isAuthorized = false;
// TODO: REMOVE THIS IF GOING TO PRODUCTION
if (process.env.SITE_ENV === 'TEST_SITE') {
const user = { isLoggedIn: isAuthorized, id: 'TEST_SITE_ID_123456' };
req.session.set('user', user);
await req.session.save();
res.json(user);
}
const userData = await User.findOne({ username });
const savedPassword = userData?.password || '';
isAuthorized = await compare(password, savedPassword);

6
sample.env Normal file
View file

@ -0,0 +1,6 @@
MONGO_URL=
SECRET_COOKIE_PASSWORD={NEXT_IRON_SESSION_COOKIE_PASSWORD}
ROOT_DOMAIN=localhost:3000
NEXT_PUBLIC_CLOUD_NAME={CLOUDINARY_NAME}
NEXT_PUBLIC_FOLDER_NAME={CLOUDINARY_FOLDER_NAME}
SITE_ENV=TEST_SITE

View file

@ -1,8 +1,6 @@
// import mongo from 'mongodb';
import mongoose from 'mongoose';
// const { MongoClient } = mongo;
const url = process.env.MONGO_URL;
async function connectDb() {
@ -17,16 +15,6 @@ async function connectDb() {
useFindAndModify: false,
useCreateIndex: true,
});
// try {
// // Confirm connection
// await client.db('weddinguser').command({ ping: 1 });
// console.log('🗄️ Connected to DB Success');
// } catch (e) {
// console.error(e);
// // If there is a problem close connection to db
// await client.close();
// }
}
export default connectDb;