Employee Polls (Udacity)

This project is my variant of the Employee Polls project created for Udacity's React course. This is an application that allows users to vote via polls which answer they would rather do in a "Would you rather" question scenario.

Installation

How to start the application:

• Install all required project dependencies

npm i

• Start the Development Server

npm start

Testing (Jest)

• Navigate to the correct folder

npm test 

Project Overview

Login (/login)

Please log in with the data from the _DATA.js

Dashboard (/)

Before Answering

If you have not answered a question yet, it will be displayed on the yet-to-be-answered page.

After Answering

Once the question is answered, it will be displayed on the answered page. Use the slider on the right to get there

Poll-Page (/questions/:id)

Before Answering

If a question has not yet been answered, you must answer it first.

After Answering

After that you can see how many people have also voted like this

Leader-Board (/leaderboard)

Of course there is also a leader board where you can see who has asked and answered how many questions.

Question-Adding (/add)

If you want to ask your own questions then please use the question adding page

src/File-structure

├── App.css
├── App.js
├── App.test.js
├── __snapshots__
│   └── App.test.js.snap
├── actions
│   ├── authedUser.js
│   ├── questions.js
│   ├── shared.js
│   └── users.js
├── components
│   ├── dashboard
│   │   ├── Dashboard.js
│   │   └── dashboard.css
│   ├── leader-board
│   │   ├── LeaderBoard.js
│   │   └── leaderboard.css
│   ├── login
│   │   ├── LoginScreen.js
│   │   ├── LoginScreen.test.js
│   │   └── __snapshots__
│   │       └── LoginScreen.test.js.snap
│   ├── navbar
│   │   ├── Navbar.js
│   │   ├── Navbar.test.js
│   │   ├── __snapshots__
│   │   │   └── Navbar.test.js.snap
│   │   └── navbar.css
│   ├── privateroute
│   │   └── PrivateRoutes.js
│   ├── question-adding-page
│   │   ├── QuestionAddingPage.js
│   │   ├── QuestionAddingPage.test.js
│   │   ├── __snapshots__
│   │   │   └── QuestionAddingPage.test.js.snap
│   │   └── questionaddingpage.css
│   ├── question-card
│   │   ├── QuestionCard.js
│   │   └── question-card.css
│   └── question-poll-page
│       ├── QuestionPollPage.js
│       └── question-poll-page.css
├── data
│   ├── _DATA.js
│   └── _DATA.test.js
├── index.css
├── index.js
├── middleware
│   ├── index.js
│   └── logger.js
├── reducers
│   ├── authedUser.js
│   ├── index.js
│   ├── questions.js
│   └── users.js
├── reportWebVitals.js
├── setupTests.js
└── utils
    ├── api.js
    └── helper.js

_DATA

Udacity has provided a _DATA.jsfile, which contains not only exemplary user and question data, but also the possibility to modify them with the following functions

There are 4 possible requests:

• 1️⃣ _getUsers
• 2️⃣ _getQuestions
• 3️⃣ _saveQuestion
• 4️⃣ _saveQuestionAnswer

1️⃣_getUsers

Method Signature:

 _getUsers();

2️⃣_getQuestions

Method Signature:

_getQuestions();

3️⃣update

Method Signature:

_saveQuestion(question);

4️⃣search

Method Signature:

_saveQuestionAnswer({ authedUser, qid, answer })

Important

Creating new questions or answering questions does not directly change _DATA.js. Therefore the page resets itself when the page is reloaded.

Create React App

This project was bootstrapped with Create React App. You can find more information on how to perform common tasks here.

Contributing

This repository was created based on the entry code for all Udacity students.

For details, check out CONTRIBUTING.md.