A safe place for people to ask any and all questions on their minds, to get answers from other curious and interested people from around the globe.
All pages have a footer with links to the creators GitHub and Linkedin accounts as well as links to their other projects.
- Splash page allows users to access login, register, or use a Demo account to check out the app. Along with a biref description of the apps purpose.
- The Feed Page allows users to view the questions feed, click to see responses to each question and add their own responses. This is essentially a one page app. All of the actual app interaction will happen in the feed page. They can edit or delete any question or response they have asked or answered with.
- They have their own questions sidebar where they can see the questions they have asked as well as ask their own question. When clicking on a question in their sidebar they will be scrolled to their question in the feed.
- The Responses drop down populates just under each question dynamically.
- Much of the app conditionally renders.
To build/run project locally, please follow these steps:
- Clone this repository
git clone https://github.com/TheGuilbotine/AskPeeps.git
- Install Pipfile dependencies and create the virtual environment
pipenv install
- Install npm dependencies for the
/react-app
cd react-app
npm install
-
In the
/
root directory, create a.env
based on the.env.example
with proper settings -
Setup your PostgreSQL user, password and database and ensure it matches your
.env
file -
Before running any flask commands, confirm you are in the pipenv virtual env. If not, run the command:
pipenv shell
- In the root folder, migrate tables to the database by running in the terminal:
flask db migrate
- In the root folder, seed the database by running in the terminal:
flask seed all
- Start the flask backend in the
/
root directory
flask run
- Start the frontend in the
/react-app
directory
npm start
- Some rerenders were diffiuct to implement smoothly, but eventually were mastered with creating a new slice of state for specifically the users information and related resources because of the nested nature of responses in questions coming from the backend.
- Finding a way to allow only one drop down to open when clicking on a Responses drop down div button. I was breaking my code into many components and did not bring the function to open and close the div into the right component.
- Edit and Delete was being difficult for a while beacuse of idx being used for keys instead of the id of the object mapped from the questions and responses arrays.