Palette Hub

Personal ProjectLiveGitHub

ReactSpring BootREST APINginxBootstrapSASSMySQLDockerDocker ComposeAzure

Palette Hub is a social media site for sharing palettes of hex code colors. Users can register with their Google account to create, browse, and share palettes, as well as engage with them through “likes.”

🥞 The Stack

The purpose of Palette Hub is to showcase a full stack website including Database Management, Backend REST API, Frontend Website, and Container Orchestration. I diversified the stack to exhibit a wide range of skills. The stack includes a MySQL Database, Spring Boot REST API, React website, Nginx web server, and Docker Compose container orchestration.

Deployment

• Docker images
• Azure VM
• Docker Compose Container Orchestration
• Bash scripts

REST API

• Java Spring Boot
• JWT Authentication
• Sign In with Google for Web
• Apache Maven
• Testcontainers
• JUnit

MySQL Database

• Schema design
• Stored procedures

Nginx Web Server

• Reverse Proxy to REST API
• Serve react app build
• Let's Encrypt (SSL Certificate) with certbot

React App

• React.js
• Bootstrap
• Bootstrap icons
• SASS
• Google Analytics

🔭 The Future

Going forward I'm focusing expanding the targeted market as well as user acquisition. I'm taking the following steps to accomplish this:

• Migrating from React to Next.js for improved SEO and page load speed.
• Adding a search feature to let users look for specific collections/palettes.
• Adding more customization to palettes (description & tags)
• Adding features for different market groups such as copyable css code for developers, paint color tester (similar to the Behr color visualizer), and image uploads for photographers and artists.

🔎 Technical Documentation

The entire website codebase is available on GitHub for review. Additionally each directory has a README going into further detail on how each segment of the website works. For example, the REST API endpoint readme documents all the endpoints and their features.