Skip to content

coolokawesome/vanityplates2

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

21 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Canada Plates - Vanity Plate Customizer

Canada Plates is a license plate customizer that allows the user to create personalized vanity plates using all plates available in Canada!

Description

Canada Plates is a single-page web application that provides a simple and intuitive interface for users to enter text and generate custom license plates using different Canadian province license plate designs. Users can choose their preferred province's license plate style and overlay their desired text on top. The website also includes a download button that allows users to save their customized license plates as images.

The second version of the Canada Plates application underwent a significant UI redesign and was built using React.js, instead of pure HTML and JavaScript (see version one here). Recoil.js was utilized for state management, allowing efficient sharing of data between components. The development process involved revamping the UI with modern aesthetics, integrating Recoil.js for state management, and implementing modular components using React.js. Thorough testing and bug fixing were performed, followed by deployment to vercel (see deployment here). Continuous improvements were made based on user feedback and monitoring.

Features

  • Custom Text: Users can enter their desired text to be displayed on the license plate.
  • Province Selection: Users can choose from a variety of Canadian provinces to match the license plate design.
  • Download Functionality: Users can generate and download their customized license plates as images for personal use or sharing.

Tech Used

  • React.js
  • Recoil.js (state management)
  • CSS
  • Bootstrap (grid + utils)
  • HTML2Canvas
  • Whats To Come?

    I'll be working on updating the mobile layouts soon, as horizontal scrolling can be an issue on some devices.

    Contact

    if you have any questions about this project, feel free to contact me at syrussamson.ca

    Thanks for looking! 😁