https://github.com/nabil6391/survey-maker
https://github.com/nabil6391/survey-maker
Last synced: 3 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/nabil6391/survey-maker
- Owner: nabil6391
- Created: 2022-02-20T04:21:09.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2022-07-01T09:11:23.000Z (over 3 years ago)
- Last Synced: 2023-03-06T03:35:42.962Z (over 2 years ago)
- Language: TypeScript
- Size: 25.5 MB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
A responsive web application built with next-js to let User type A (e.g. teacher/speaker) collect feedback from users of type B (e.g. audience). User type B can share their feedback anonymously in less than 30 seconds.
#Screenshots
#Style Guide
# Project Plan
https://docs.google.com/spreadsheets/d/1caZhcuWzN1u0i26zU5BxitP3eqygxm1YQzY7vDRISqs/edit?usp=sharing
# Features
## Must-Haves
User A (teacher)
- [x] Signup / Login
- [x] Dashboard user/[username]
- [x] User not Found page
- [x] Create new Survey (Name, Slug)
- [x] Add Questions
- [x] Pick question type (Premium Feature)
- [x] Customize Question/Answers
- [x] Edit Questions
- [ ] Delete Questions (also when responses exists)
~~- [ ] Save Survey as Draft~~
~~- [ ] Publish Survey~~
- [x] Get URL onClick
- [x] View Survey Results (Statistics)
- [ ] Delete Survey (also when questions exists)
- [x] Logout
User B (audience)
- [x] Open survey via URL
- [x] Fill out form
- [x] Thank you page on Submit
## Nice to Haves (work in progress)
User A
- [x] Redirect on Login (Authentication - User Login - 1:50:00)
- [ ] Reset Password
- [ ] Duplicate Survey
- [ ] Filter results by date (from dd.mm.yy to dd.mm.yy)
- [ ] Create own template
- [ ] Fancy UI for statistics & charts
- [x] optimize design also for web
- [ ] Edit survey name + URL
- [ ] Cookie & Privacy settings
- [ ] accept terms and conditions
- [ ] double opt in via mail
User B
Landingpage elements to interact live with USER A
- [ ] "Let's have a break" - Button
- [ ] Input Field to submit a question/comment
- [ ] Button to Start Survey
- [ ] See survey results after submit
- [x] optimize design also for web
- [ ] set a cookie to let every user participate only once
## Database
- [x] Define Structure
- [x] Create a PostgreSQL database and table(s)
- [x] Connect to and query information from database
ENUM question_type {
x_slider
y_slider
gauge
binary
}
## Tests
- [ ] E2E - Cypress (in progress)
- [ ] Unit Tests - Jest (in progress)
## TypeScript / JSDoc
- [x] for all major components
## Deploying
- [x] Deployed to Heroku https://myquicksy.herokuapp.com/
# Technologies used
- Next.js
- Postgres.js
- Jest
- Cypress.io
- GitHub Actions
# Libraries used
- emotion/core
- nextcookies
- camelcase-keys
- ley
- dotenv
- recharts
# Setup Instructions
### Database Setup
Install postgres on your machine: https://www.postgresql.org/
Start postgres
```
postgres
```
Login with super-User on Windows:
`psql -U postgres postgres`
on mMac:
`psql postgres`
Setup new user and new database
```
CREATE DATABASE ;
CREATE USER WITH ENCRYPTED PASSWORD '';
GRANT ALL PRIVILEGES ON DATABASE TO ;
```
Connect to the database using new user
quit psql
`\q`
and reconnect with newly created user
`psql -U ;`
Rename `example.env` to `.env` and insert your data
```
\_PGHOST=
\_PGDATABASE=
\_PGUSER=
\_PGPASSWORD=
\_CSRF_TOKEN_SECRET=
```
Add `.env` to .gitignore!
### Migrations
Running the migrations
To set up the structure and the content of the database, run the migrations using Ley:
`yarn migrate up`
To reverse the last single migration, run:
`yarn migrate down`
### Start Server
`_npm run dev_`
or
`_yarn dev_`
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
# Deployment instructions
Deploy on Heroku https://dashboard.heroku.com/
- create a new app
- Connect to your Github Repo
- Install the Heroku Postres Add-on
- Deploy
# Tests
## Jest
`_yarn jest_`
## Cypress
`yarn cypress start`