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.
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.
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
- Key for Accuweather API which can be found here.
- 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
This is a tool created for new and seasoned gardeners alike.
- Create an account using the
Registration
page. - From the
Splash
page, add a new plot using the indicated button. - On the
Shade
page, map out the sunny/shady parts of your garden bed, and set a month/year for that plot. - 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). - On the
Garden Design
page, place your plants where you'd like and submit! - Back on the
Splash
page you can addNotes
for that plot as well as tasks for yourTask List
. You can also edit your plot from this view, as well as toggle through the months when you have created multiple plots. - That's it! You can keep a running track of what you've grown, where and how it went!
React, Redux/Saga, Node, Express, PostgreSQL, HTML5, CSS3, Axios, Passport, React Scroll Paralax, Moment.js, SweetAlerts, Accuweather API.
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.
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.