Tech About It

Contents

1. Description
2. DBMS
3. Demo
4. About
5. Contributing
6. Author

Description

Link to Live App

Tech About It is a place for all things tech! This is a blog site where tech-enthusiasts can share thoughts about technology, coding, engineering, or just about anything involving tech. This site was made so that I have a custom place to showcase blog posts about programming topics I learn. I used to post to GitHub gists, but wanted to have the functionality and features of a dedicated blog. So I decided to make my own! I hope you enjoy!

Directory Tree

├── dist
│   ├── assets
│   └── images
├── public
│   └── images
├── server
│   ├── __pycache__
│   ├── db
│   ├── models
│   ├── routes
│   ├── utils
│   └── venv
└── src
    ├── components
    ├── pages
    └── utils

DBMS

Data is stored on the deployed gunicorn web server thanks to JAWSDB. Tables and columns are set up using the SQLAlchemy ORM. MySQL is the database flavor for this project. See below for the models and relationships:

Demo

About

First, a RESTful API was built using Flask. There are API endpoints for CRUD operations for Users, Posts, Comments, Likes, and Saves. This logic was handled using Python. MySQL is the database flavor for this backend. A SQLAlchemy engine was used to interface between the SQL database and the app. In the deployed version, the Flask app is serving a static build of a React app, scaffoled using Vite. All of the front-end logic is handled with TypeScript. React Router is implemented to serve url routes directly on the front-end. CORS requests were made possible thanks to Flask-CORS. Cloudinary is utilized to handle User and Post image uploads. The Remark ecosystem offered tools used for parsing, sanitizing, rendering, and handling of math notation (KaTeX) within Markdown. XSS attacks were a concern with adding support for Markdown, requiring use of Rehype libraries. The Rehype and Remark ecosystems are part of the Unified Project. See below for a full list of tools used.

Contributing

This app was made possible thanks to:

• Flask
• Flask-CORS
• SQLAlchemy
• Cloudinary
• Node.js
• React
• React Router
• Axios
• Unified for Markdown parsing, sanitization, and more.
• The Remark ecosystem
• The Rehype ecosystem
• React Markdown
• React Markdown Editor
• Styled Components
• Vite
• ChatGPT for the questions Google couldn't help with!

License

Author

My name is Daniel Bartolini. Contact me here on GitHub, or via my portfolio. Thanks for checking out Tech About It!