Skip to content

seprest1/seedling

Repository files navigation

Seedling

seedlinglogo

There are countless books, resources, and online forums that a new gardener has access to, but the information can be overwhelming when creating a new project. What to plant, where to plant it, when to plant, what to place it next to, those are just the very basics when creating a garden bed. Even seasoned gardeners learn throughout the years, what works and what doesn’t, collecting this information to use for the next growing season. Seedling is a desktop application that allows users to plan their garden, collect notes and learn general gardening information. It is interactive and intuitive, simple and complete, to make the process of getting started easier, and allow the user to get in the dirt sooner.

Approach

Duration: Two Week Sprint

As my first large project, I went through the process of pitching, scoping, wire-framing and designing the ERD during the week before construction. With a lot of ideas and some courage, I managed to create an app that mirrored my vision.

Screen Shot 2022-11-03 at 7 37 27 PM

Demo

Seedling is currently hosted on Heroku, under a free plan (expect a bit of lagging). An account with already populated plots for viewing can be seen when logging in as beet_root with the password 12345.

seedlingintro.mp4
Seedling2.mp4
seedling3.mp4

Getting Started

Prerequisites

  • Key for Accuweather API which can be found here.

Installation

  • Run npm install
  • Create a .env file at the root of the project and paste this line into the file: ACCUWEATHER_API_KEY='your_api_key_goes_here'
  • Create a database named Seedling, create the tables and insert the data listed in the database.sql file.
  • Start the server with the script: npm run server
  • Start the client with the script: npm run client
  • Navigate to localhost:3000

Usage

This is a tool created for new and seasoned gardeners alike.

  1. Create an account using the Registration page.
  2. From the Splash page, add a new plot using the indicated button.
  3. On the Shade page, map out the sunny/shady parts of your garden bed, and set a month/year for that plot.
  4. From the Plant List page, learn about plants and their growing seasons, growing conditions and companion plants. Add plants to your list and edit their subvarieties if desired. Make sure to have plants that match each shaded section of your garden ('Full Sun' plants for the sunny section).
  5. On the Garden Design page, place your plants where you'd like and submit!
  6. Back on the Splash page you can add Notes for that plot as well as tasks for your Task List. You can also edit your plot from this view, as well as toggle through the months when you have created multiple plots.
  7. That's it! You can keep a running track of what you've grown, where and how it went!

Technologies

React, Redux/Saga, Node, Express, PostgreSQL, HTML5, CSS3, Axios, Passport, React Scroll Paralax, Moment.js, SweetAlerts, Accuweather API.

Future Plans

My initial goal with creating this app was to utilize a larger plant API in order to tap into a large data-set. Unfortunately, I was unable to find one that was up-to-date and accessible in the ways that I needed.

Therefore, hardiness/growing season data is hardcoded specifically for the Midwest, but the data architecture allows for further functionality. Ideally, when a user enters their zip code, it should register a certain hardiness zone, and then only display plants (and their growing seasons) specific to that hardiness zone.

I would love to see this app have access to a larger database of vegetables, as well as fruits and herbs.

Current logic could allow for the user to choose their own plot size, if a component is created with that specific interface.

Acknowledgement

Thanks to Prime Digital Academy, my instructor Matt Black and my fellow classmates, whose encouragement, instruction, and collaboration helped me create this app.

Thanks to Accuweather for supplying access to real-time weather data.