/Blog

This was my blog application was written in JSX and with hooks. Blog posts of my story, information on Software Engineering topics, and even some walkthroughs/tutorials.

Primary LanguageJavaScript

HoseaCodes-Blog

Created by: Dominique Hosea

September 2020

Welcome, to my personal blog and portfolio. Sharing information is vital and especially in the dev commnunity. The blog showcases my latest works, testomines, articles, about me section, and contact me section. It mainly focuses on my current and most recent accomplishments.

[![NPM Version 7.6.3][npm-image]][npm-url]

Homepage

Homepage

Blog Page

Article Page

Getting Started

The user is brought to the home page where they can navigate to my portfolio, my blog posts, my about me, or contact page. The home page is an introduction to who I am. The is a brief history of my experience with the option to download my resume. Additionally, I have the technologies that I am currently using, a project showcase, an embbed Twitter widget, and testimonies.

Technologies Used

This application was developed with a full MERN stack. and written in JavaScript. Styling done with Bootstrap, Material UI, SASS or SCSS and CSS.

M - MongoDB, NoSQL database
E - Express, a back-end framework
R - React, a client side framework
N - NodeJS - to run back end service

Dependencies used:

  • Morgan - HTTP request logger middleware for node.js
  • Fetch - Promise based HTTP client for the browser and node.js
  • Bcrypt - A library to hash passwords
  • Mongoose - for MongoDB validation
  • React-Bootstrap - a React library for building pre-styled components
  • Material UI - a library for building pre-styled components
  • SASS - a preprocessor scripting language that is interpreted or compiled into Cascading Style Sheets

Features

✅ Own your content

✅ Write using Markdown On Github Issues

✅ Syntax/Code Highlighting

✅ Fully customizable

✅ Tags - Topics

✅ Links

✅ Reactions

✅ View Comments

✅ Images

✅ Minutes Read

✅ Beautiful UI Like Medium

✅ Easy deployment: Using Github Pages

✅ Instant Effects on Blog when changing github issues

✅ Beautiful blockquote

Frontend

See wiki for details.

Backend

See wiki for details.

Dev Ops

See wiki for details.

3rd Party Packages

Name Use Case
AOS Animation
Axios HTTP client
bcrypt
dompurify
framer-motion
imagemin
markdown
marked
moment
morgan
node-cache
node-sass
react-bootstrap
react-bootstrap
react-icons
react-masonry-css
react-sticky-state
react-twitter-widgets
source-map-explorer
styled-components
winston

External APIs

See wiki for details.

How To Run App

Build image locally

docker build -t hoseacodes_blog .

Run local image in container

docker run --name hoseacodes_blog_c -p 3000:3000 -d hoseacodes_blog

Unsolved Problems

  • Fix Docker Image

Future Enhancements