Giter Site home page Giter Site logo

suri-garden-client's Introduction

Suri Garden App Client

Current Version: v1

Deployed Client: https://natesuri.github.io/suri-garden-client/ Deployed API: https://pacific-reaches-70030.herokuapp.com/ Github repo: https://github.com/Natesuri/suri-garden-client

v1 (current version) An app that allows a user to plant into and remove plants from plots that they own own plots with unique atrrtibutes. Communicates with custom API: https://github.com/Natesuri/Suri-Garden-App

v2 A user can add plants to their plots from a pre-determined list plants list.

v3 User is able to receive reminders of how often they need to water individual plants.

.....

The client uses HTML, CSS, JS, BOOTSTRAP, SASS, HANDLEBARS, JQUERY, and AJAX: A user can view all their plots on page load, and click through individual plots to view and update a single pllots attributes. Buttons on the page open bootstrap modals in which the user can send AJAX CRUD requests to the RESTful custom API. The returned data is passed into a handlebars template and inserted into the page using jQuery. The page is structured with bootstrap, but may be restructured later to work without bootstrap. The site is mobile responsive.

Planning and execution: Set out to make a garden management application that's engaging and fun, but also helps a user take care of their plants with reminders. Can work with small gardens and eventually larger homesteads. The application is designed to feel like a game, with the idea that most data is represented with visual icons as opposed to being text heavy. The current version uses dummy plants in plots (the green squares) and future versions will actually display the correct number of plants in a plot. The representation of a plant may also change. It could be an actual icon of a plant, or perhaps a color that represents a plant type (tuber, vine, grain, etc.)

Unsolved and Unfinished Content: Need to accurately represent plants on the page and set reminders for users based off those plants watering and harvest patterns.

Wireframes: https://www.dropbox.com/sh/n7axklrf0z4zbzy/AAD9R4-KKpNCLi1vTP_hGk7ua?dl=0 User Stories: https://www.dropbox.com/sh/zbn1mid4xna5g25/AAA4uedIUNg4-fLdECXC3BQ3a?dl=0

suri-garden-client's People

Contributors

natesuri avatar

Watchers

James Cloos avatar

suri-garden-client's Issues

A user can see available plant presents.

The user can see a preset list of plants that they can add to their plots.

  • For first pass, probably accessible only through the add plant action in the individual plot view.
  • Will add plants to plots through the rails console for testing preset list & plant attributes.

On the individual plot view a user can remove plants from a plot.

A user should be able to remove a plant from a plot when in the individual plot view.

  • The first version of this will involve simply deleting the plant from the plot.
  • Future versions of this feature may save this data somewhere, and ask whether this plant was harvested, lost, or removed for another reason (accidental placement, etc).

A user can see a plant's attributes.

A user can see what attributes (preferred brightness, plant type, care description etc.) a plant has by interacting with it.

  • First version will start with a click or hover showing the plants attr. in a box on the plant presets screen.
  • Maybe an individual plant view as well?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.