Skip to content

timmellis/green_thumb_frontend

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

39 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Green Thumb

A mobile-first application to help keep your houseplants happy and healthy!

Created by Tim Ellis

for the General Assembly SEI Capstone Project

LinkedIn | GitHub


Bonus: This project also produced an incidental but quite valuable secondary deliverable -- a tutorial on installing and configuring SimpleJWT Authorization for a DjangoREST + React application, which can be found here.


Summary

House plants come in all shapes and sizes. Some are hearty and uncomplaining, while others are tempermental and start to wither when even the slightest thing goes out of balance. But plants owners will tell you that keeping track of watering schedules, light levels, temperatures, humidity preferences, and more can be a helluva chore.

That's where Green Thumb comes in! Green Thumb will keep track of the basic care information for each plant in your collection, suggest the best location in your home based on light levels, and even give you reminders for watering and feeding schedules for your leafy friends.


The Project

This web application was developed as the capstone project for the General Assembly SEI Program in May, 2022. The project requirements were to develop a full-stack appliation with full CRUD capabilities using any of the front- and back-end technologies we had learned over the 12-week intensive course. I opted to utilize a Python/Django backend (the newest and least familiar structure we had learned), paired with a front-end built in React.js.

Functionality

The primary functionality centers around a user's ability to set up their home's "Locations", add plants to their "Houseplants" collection, and setting a few simple preferences. The application will then display organized information about each plant and location. It will also create an auto-generated calendar based on matching their plants' needs with their preferences, which can be viewed in "Month" or "List" mode.

Unlike the user-specific database information like personal houseplants and locations within the home, the Plants stored in the database are collectively generated by all users -- if another user has already entered a given plant's care instructions, the next user does not need to duplicate their work! I find this sort of collective sharing of information to be a wonderful, community-oriented way of generating data.

Development and Orgainzation

Resources

Technologies

React.js -

Json Web Tokens -

React-Icons -

React-Bootstrap -

Full Calendar React component library - https://fullcalendar.io/docs/react

Google Fonts -

Logo (sources) -

Planning

Component Heirarchy

Component Heirarchy


Backend Development & Database Structure

The database stores a library of information about each Plant and its needs, which is generated collectively by all users. as well as information about the User, the Houseplants they own, the Locations in their home, and their preferences for watering schedules.

Entity Relationship Diagram

Note: The Gallery feature did not ultimately get implemented on this version of the project, but I hope to include it in an updated release later this year.

Backend development Resources

Django, DjangoREST Framework

Django CORS Headers

SimpleJWT Authorization for Django


Other credits and citations:

  • Simple script to check if Image URL exists (Link)
  • Set a timeout function to automatically close Bootstrap modal (Link)

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published