This is a website that allows you to create inspirational boards with notes.
Created using Javascript/React for front-end and Python for back-end.
Demo link: http://ice-ice-inspo-board.herokuapp.com
Canva Slide Presentation: https://www.canva.com/design/DAEi_mbu8HI/ivOCNb491BLizeBCBZDVMg/view?utm_content=DAEi_mbu8HI&utm_campaign=designshare&utm_medium=link&utm_source=publishsharelink
- Create new Message Boards
- Create new inspration cards for each board
- Add likes to each card
- Delete cards from Message Boards
- Sends notification on slack when someone posts a new board and or card
Inspiration Board relies on:
- React
- Axios
- Flask
- Yarn
- SQLAlchemy
In the project directory, you can run:
$ npx create-react-app .
Install axios:
$ yarn add axios
Create a file named .env
.
The front-end layer needs to send API requests to the back-end layer. In order to handle this, the front-end layer repo must include a .env
file with this line:
REACT_APP_BACKEND_URL=http://localhost:5000
Use this environment variable to send your API requests. You can read it by using the expression process.env.REACT_APP_BACKEND_URL
. For example, we may use it like this in any component:
axios.get(`${process.env.REACT_APP_BACKEND_URL}/ice-ice-inspo-board`, {
// ...
This will make Heroku deployment easier.
Commit and push your files to your repo, especially including the package.json
file!
The goal for setup is to cover all of the set up needed at the beginning of this project, which includes:
- Forking and cloning
- Managing dependencies
- Setting up development and test databases
- Setting up a
.env
file - Running
$ flask db init
- Running
$ flask run
and$ FLASK_ENV=development flask run
- Fork this project repo to your own personal account
- Clone this new forked project
Create a virtual environment:
$ python3 -m venv venv
$ source venv/bin/activate
(venv) $ # You're in activated virtual environment!
Install dependencies (we've already gathered them all into a requirements.txt
file):
(venv) $ pip install -r requirements.txt
Create a database:
- A development database named
your_database_name
Create a file named .env
.
Create two environment variables that will hold your database URLs.
SQLALCHEMY_DATABASE_URI
to hold the path to your development database- [OPTIONAL]
SQLALCHEMY_TEST_DATABASE_URI
to hold the path to your development database
Your .env
may look like this:
SQLALCHEMY_DATABASE_URI=postgresql+psycopg2://postgres:postgres@localhost:5432/your_database_name