N8 Tech Blog is a full-stack CMS-style blog site where developers can publish their blogs and add comments on others. Users can also view all their posts and comments they've made along with having access of updating/deleting their posts/comments from their dashboard.
They can access individual posts from there as well. The app is deployed on Heroku and uses the MVC paradigm, handlebars, Sequelize (ORM), and express-sessions for authentication.
I did go all out on the styling 😂 and spent some time messing around on how I wanted each page to be styled.
The tools for styling that came in clutch:
Deployed app: https://techer-blogger.herokuapp.com/
As a new user/dev, you are able to share concepts, recent advancements, and new technologies by navigating to the dashboard from the navbar and creating your first post.
But before anything, you'll be prompted to login if you try clicking on an existing post or the dashboard while you're not signed in. But once you're in, you can create posts and comment on other user's post.
You are able to view, edit, or completely delete your posts/comments all from the dashboard.
Before Cloning/forking, this app runs on Node.js and has a few NPM packages within, just keep in mind.
-
Once you're ready, install all packages with
npm install
in the terminal. -
Set up your
.env
file. This project will automatically acquire an.env.example
with a demo layout inside. You can just remove the.example
and replace the demo values with your own. -
The
.env
values you're change will be the database name, user name, and password. -
Now let's actually start to create the database by running
mysql -u root -p
in the terminal, then enter your password. -
When you are in, run
source db/schema.sql
to create the database, then typeexit
to exit the mysql CLI.
Boom! that's it for setting it up, you're ready to start the server.
To run the application, simply do npm start
in the terminal, for nodemon you can use npm run watch
.
If everything went smooth, you should see 'Now listening on http:/localhost:3001', just 'ctrl + click' the link and it will take you to the page.
Click here to view the mobile screen sizes
Folders containing all images:
No specific rules for contributing, but if you want to support you can make an issue in the 'issues' tab on Github which I can review to improve the app! :)
Or feel free to fork this repo, add your changes, and make a pull req!
Hey hey, Reach Out!
Github: TDGNate
Email: itsnzte@gmail.com