Giter VIP home page Giter VIP logo

strain-brain's Introduction

Strain Brain

Many people use medical marijuana on a regular basis, however every marijuana strain and individual are not built the same. Strain Brain was built with medical marijuana patients in mind, in an effort to simplify the process of finding the right strain for the right individual.

Getting Started

The following instructions will get you a copy of the project up and running on your local machine for development and testing purposes.

Prerequisites

  1. Download and install Node.js, if not already installed on your local machine.
  2. Install React with the following terminal command:
npm install --save react
  1. Install ReactDOM with the following terminal command:
npm install --save react-dom
  1. Install React Bootstrap with the following terminal command:
npm install react-bootstrap bootstrap
  1. Install json-server with the following terminal command:
npm install -g json-server
  1. Get an API key for The Strain API. Do NOT share this API key with anyone else.

  2. Clone my repository to your local machine.

  3. Navigate to the project folder. In the src directory, you will see a file named .Settings.js (note the dot at the beginning).

  4. Copy that file with cp .Settings.js Settings.js. The Settings.js file is already in the .gitignore file, so it won't ever be tracked by git. This will prevent you from accidentally sharing your API key with other people.

  5. Copy the API key that you registered into it's appropriate place in the Settings.js file.

Usage

A step by step series of examples that tell you how to get a development env running

  1. In your terminal, navigate to the project directory.

Example:

cd /Users/travis/workspace/strain-brain
  1. From the root of this directory, run the following terminal command in order to start up React.
npm start
  1. Open a new terminal tab and navigate to the api directory.

Example:

cd /Users/travis/workspace/strain-brain/src/components/api
  1. Run the following terminal command in order to start up your json-server.

Example:

json-server -p 8088 -w database.json
  1. Open your web browser of choice and navigate to http://localhost:3000/

  2. You will be presented with a login/registration page if this is your first time using the application. Register an account (NOTE: USE DUMMY DATA! Do NOT use your real email or password).

  3. From this point on, the web application itself has "Toggle Help" options, but for the sake of clarity I'll include the correct flow of usage. As a new user, you will first want to navigate to the Conditions tab. From there, you will be able to select different medical conditions to set up your profile. These medical conditions are used to generate a list of recommended strains which can help the patient with the conditions that they have. After setting your conditions, navigate back Home to view your customized results. The home screen will now have strain recommendations for you to try. If you enjoy a particular cannabis strain, you can add it to your Puff list. If you dislike a particular cannabis strain, you can add it to your Pass list. Photos of this workflow will be provided below.

  4. Enjoy!

Login view

alt text

Home view of a brand new user

alt text

Setting up medical conditions

alt text

Home view after setting medical conditions

alt text

Built With

  • React - A JavaScript library for building user interfaces
  • React Bootstrap - The most popular front-end framework Rebuilt for React.
  • The Strain API - The most popular front-end framework Rebuilt for React.

Contributing

Please read CONTRIBUTING.md for details on our code of conduct, and the process for submitting pull requests to us.

Version Control

I use Git for version control.

Authors

As of thus far, this project has been planned, developed, and tested exclusively by myself, though I cannot guarantee that I won't receive contributions in the future, so I will provide a list of all contributors to be completely transparent.

License

This project is licensed under the MIT License - see the LICENSE.md file for details

Acknowledgments

  • Thank you to the creator of The Strain API, which I used to get information for each cannabis strain. My application could not exist without the data provided by that external API.

strain-brain's People

Contributors

thetechtravis avatar

Stargazers

 avatar  avatar  avatar  avatar

Watchers

 avatar

strain-brain's Issues

Strain Results UI

User Has No Medical Condition(s) Added

Given User is authenticated but has not yet added their medical condition(s)
When User is viewing the main Strain Brain UI
Then User should be presented with a "Click for Help" affordance, which will direct them towards setting userConditions in the Conditions tab. No strains should render if no conditions are set.

User Has Medical Condition(s) Added

Given User is authenticated and they have added medical condition(s) to their profile
When User is viewing the main Strain Brain UI for the first time
Then User should be presented with a "Click for Help" affordance as well as a list of strains, each represented as it's own card
And These results will be filtered according to the medical condition(s) that User has added to their profile

Strains on the Pass List will NOT appear in filtered strain results

Pass List Strains Don't Render To Home/Puff List

Given User has added one or more strains to their Pass list
When User is viewing the Home view or Pass list
Then User's search results should be filtered per usual (according to the conditions that they have checked in the Conditions view)
And Additionally, any strains that are on User's Pass list should NOT render to the DOM

User Authentication

New User Visits

Given a user wants to use Strain Brain
When the user first accesses the application
Then the user should see a login form
And the user should see a registration form

Previously Authenticated User

Given a user wants to use Strain Brain
When the user has previously authenticated (i.e. a activeUser token exists in local storage)
Then the user should see the Strain Brain UI components

New User Registration

Given the user fills out the registration form
When the user clicks the Register button
And the username is unique
Then the login and register form should disappear and the main Strain Brain components should be rendered

Existing User Login (if localStorage is cleared)

Given the user fills out the login form
When the user clicks the Login button
And the username exists
And the password matches the stored password for the username
Then the login and register form should disappear and the main Strain Brain components should be rendered

User Conditions

User Conditions

Given a user wants to filter strain results by condition (depression, insomnia, etc)
When the user clicks User Settings on NavBar
Then a form should be presented with checkboxes that correlate to each medical condition that User may have
And a button to save any changes to User's entity in database.json

Search Bar

User Wants to Search
Given User wants to search through strain results for a specific strain name
When User is viewing either the Home page, Puff, or Pass list
Then User should be presented with a search bar below the navbar
And Typing characters into this search bar will filter strain results to find matching results

Puff and Pass Lists

Access Puff/Pass List Form

Given User wants to "favorite" or "dislike" a strain
When User clicks Strain Details button of a strain card
And User clicks an affordance for adding the particular strain to a list (i.e. "Add to Puff/Pass?" button)
Then User should be presented with a form where they can select from three radio buttons (add to puff, add to pass, remove from puff/pass)
And An optional text input field where User can write a note about the strain

Add to Puff/Pass List with Note (note is optional)

Given User has done the steps above to access the Puff/Pass List Form
When User selects the Add to Puff List or Add to Pass List button, creates an optional note, and clicks the "Save Changes" button
Then That strain should be added to the database
And That strain should be added to User's Puff/Pass List (depending on the radio button User selected) and then redirect back to Home view

Remove from Puff List

Given User wants to remove a strain from their Puff or Pass List that they previously added
And User has done the steps above to access the Puff/Pass List Form
When User selects the "Remove from Puff/Pass List" radio button
Then The note text input field should be disabled
And That strain should be deleted from the database
And That strain should be removed from User's Puff/Pass List and then redirect back to Home view

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.