-
π QueryQuill
Frontend Repository | Live App
Custom document processing and AI query assistant, built with React, Django, and FAISS. -
π Locally E-commerce
GitHub Repository | Live App
E-commerce platform showcasing handcrafted local products. Built with Next.js, Sanity, and Stripe. -
π Rhythm Music
GitHub Repository | Live App
Discover, share, and curate playlists with a sleek music player app. Developed with React, Node.js, and MongoDB.
**Feel free to reach out if you'd like to collaborate or chat about web development and tech!**
These projects are personal hobbies and side projects that Iβve built to showcase my skills, explore new technologies, and continual learning. They reflect my passion for development and experimenting with various tech stacks, but do not include my professional work. For a full overview of my professional experience, please refer to my resume.
https://query-quill-8pqht.ondigitalocean.app/ Backend | Frontend
Query Quill enables you to build custom-trained RAG (Retrieval-Augmented Generation) models effortlessly. Upload your documents, process them, and perform smart queries with ease. No deep technical expertise required! Itβs all about creating tailored AI assistants that understand and respond based on the specific content you provide.
π οΈ How It Works:
-
π Document Ingestion Upload various document types like web pages, PDFs, and raw text. We parse and normalize them for seamless processing.
-
π§ Vector Embedding Your documents undergo semantic analysis using LangChain Models. The high-dimensional vector representations are then indexed in a FAISS database for lightning-fast similarity searches.
-
π¬ Semantic Querying Utilize natural language processing to interpret your queries, retrieve relevant document segments, and generate context-aware responses through ChatGPT, RAG, and vector search.
π‘ Tech Stack:
- Frontend: React & TypeScript, Tailwind
- Backend: Django & PostgreSQL
- AI & ML: FAISS, PyTorch, LangChain
- Other Tools: JWT for authentication, Celery for asynchronous tasks, Redis for caching and message brokering
Reconnector is a dynamic social platform centered around building community by highlighting shared interests among co-workers. By fostering empathy and mutual understanding, our app lays the foundation for strong workplace relationships. It addresses the challenges of remote work by bridging the gap created by physical distance, restoring bonds through shared interests, and promoting company pride through engaging features.
With Reconnector, employees can share events and experiences, reviving workplace kinship and creating a sense of belonging. Additionally, our app incorporates gamification elements that encourage a competitive spiritβemployees can participate in events and compete against other companies to earn points. This fun and interactive approach not only strengthens internal bonds but also boosts overall engagement and morale.
Placed 1st π in the Hackathon Event: Linkedin Post
π‘ Tech Stack: Frontend: React & TypeScript Backend: Supabase, OAuth
https://rhythmmusic.netlify.app/
Rhythm music app was created to discover, share and curate playlists! The app is a full-fledged music app with all the core features of a modern music app, such as account authentication, the ability to save and create shareable links, and most importantly discover tunes from a plethora of genres. Rhythm is also fully responsive for all screen sizes with an intuitive and beautifully sleek UI. The project proved to be an incredible undertaking to build out such a feature-rich application with many moving parts. (1.5 months to develop)
π‘ Tech Stack:
Frontend
- React JS
- Redux Took Kit: Redux was a treat to use to manage states around the complexities of handling music player functionality and user session data after authentication. RTK query was also used to automate data fetching & caching for CRUD playlist functionality. Although Iβve used useContext API before, RTK will be my go-to for state management for every future project for its amazing features.
- Tailwind: Was entirely done with tailwind, creating the amazing-looking UI.
Backend
- NodeJS, Express: Entire backend was built to handle charts/ genre data, user accounts, shareable links, and many more features.
- MongoDB, Mongoose: MongoDB/mongoose is used to handle storing all user, playlists, and song data. Users are able to register for an account, save playlists, and many more features using this excellent document oriented database.
- Becrypt, JWT: Used to help hashing, and authenticating users.
https://locally-capstone.vercel.app/
Locally is my NextJS Ecommerce website centered around giving local boutique handcraft makers an accessible B2C platform. This project was a part of my final capstone project for my time at Brain station. The website is a feature-packed with e-commerce cart and checkout functionality, many dynamic routes and a beautiful UI. The project was a big undertaking considering the short time span I had and the functionality I had to develop for an MVP. Although I gained so much knowledge about new technologies, the app was also fulfilling to create because of the social responsibility and sustainability behind the project. (2 Weeks to Develop)
π‘ Tech Stack:
-
Next JS - was a vital framework and was the best option for developing an ecommerce platform like this.
- An intuitive dynamic routes and page-based routing, building dynamic filebase routing for product, makers and categories pages.
- Pre-rendering, server-side rendering (SSR) are supported for fast load times and improved SEO
- Automatic code splitting for faster page loads.
- Client-side routing with optimized prefetching.
- API routes to build API endpoints with Serverless Functions.
-
Sanity CMS - was handling all the content on the website without the need for a complex backend. Data were queried using GROQ and using Next function getServerSideProps pre-render the page on each request. Sanity rich text, image handling, and content management were crucial in having a content-heavy website work.
-
UseContextAPI - Context provides a way to share values like these between components without having to explicitly pass a prop through every level of the tree.
-
Tailwind - was amazing to use to create an elegant UI
-
Stripe Payments SDK - Handling safe payments and checkout experiences.
-
Auth0 - Centralize and manage users from multiple identity providers and give them branded, seamless signup and login experiences.
-
Google Maps API
TELUS Digital challenged us on developing an application & design to tackle the option paralysis surrounding the multitude of streaming available. The 24 hour hackathon was exhilarating from the ideation process to developing the react app. We are super proud of our innovative app that solves option paralysis creatively and practically. This was a great opportunity to work cross-collaboratively with the UX team for ideation and creative design. Telus also provided a very open challenge that sparked ingenuity and critical thinking to solve a major issue many large companies struggle with. (24 hour hackathon )
A group project collaborating using GitFlow and Agile (Jira) workflows to produce a warehousing application to manage inventory & warehouses. InStock is a full-stack react app with a nodeJS backend handling all the data. Building this inventory management app taught us the intricacies of these applications, the necessity of building reusable components, and working collaboratively. (1 Week)
BrainFlix is a video-sharing and social media platform built on react. The application features video commenting and engaging , uploading placeholder videos, and setting username session data. The application used a node express backend to create an API for video and comments. (2 Weeks)
Project assignment for the BrainStation Bootcamp that leverages beautifully responsive design for all screens, advanced Javascript for adding commenting functionality and pulling data from APIs for displaying vital information, and using the document object model to display information. (2 Weeks)