├── README.md
├── app
├── app.jsx
├── components
│ ├── Footer.jsx
│ ├── Answers.jsx
│ ├── Popup.jsx
│ └── Main.jsx
├── data
│ └── data.js
└── styles
│ └── app.css
├── server.js
├── public
└── index.html
├── .gitignore
├── webpack.config.js
├── LICENSE
└── package.json
/README.md:
--------------------------------------------------------------------------------
1 | # Quiz Application built with react
2 | Live on [heroku](http://tranquil-beyond-43849.herokuapp.com/)
--------------------------------------------------------------------------------
/app/app.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { render } from 'react-dom';
3 | import { Route, Router, IndexRoute, hashHistory } from 'react-router';
4 | import Main from 'Main';
5 |
6 | // App css
7 | import 'style!css!applicationStyles';
8 |
9 | render(
10 | ,
11 | document.getElementById("react-container")
12 | );
--------------------------------------------------------------------------------
/server.js:
--------------------------------------------------------------------------------
1 | var express = require('express');
2 |
3 | var app = express();
4 | const PORT = process.env.PORT || 3000;
5 |
6 |
7 | app.use(function(req, res, next) {
8 | if(req.headers['x-forwarded-proto'] === 'https') {
9 | res.redirect('http://' + req.hostname + req.url);
10 | } else {
11 | next();
12 | }
13 | });
14 |
15 | app.use(express.static('public'))
16 |
17 | app.get('/', function (req, res) {
18 | res.send("Hello World!");
19 | });
20 |
21 | app.listen(PORT, function(){
22 | console.log(`Listen on port ${PORT}...`);
23 | });
--------------------------------------------------------------------------------
/app/components/Footer.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 |
3 | class Footer extends React.Component{
4 | render() {
5 | return (
6 |
12 | )
13 | }
14 | }
15 |
16 | export default Footer
--------------------------------------------------------------------------------
/public/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Quizz
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # Logs
2 | logs
3 | *.log
4 | npm-debug.log*
5 |
6 | # Runtime data
7 | pids
8 | *.pid
9 | *.seed
10 |
11 | # Directory for instrumented libs generated by jscoverage/JSCover
12 | lib-cov
13 |
14 | # Coverage directory used by tools like istanbul
15 | coverage
16 |
17 | # nyc test coverage
18 | .nyc_output
19 |
20 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
21 | .grunt
22 |
23 | # node-waf configuration
24 | .lock-wscript
25 |
26 | # Compiled binary addons (http://nodejs.org/api/addons.html)
27 | build/Release
28 |
29 | # Dependency directories
30 | node_modules
31 | jspm_packages
32 |
33 | # Optional npm cache directory
34 | .npm
35 |
36 | # Optional REPL history
37 | .node_repl_history
38 |
--------------------------------------------------------------------------------
/webpack.config.js:
--------------------------------------------------------------------------------
1 | var webpack = require('webpack');
2 |
3 | module.exports = {
4 | entry: [
5 | './app/app.jsx'
6 | ],
7 | output: {
8 | path: __dirname,
9 | filename: './public/bundle.js'
10 | },
11 | resolve: {
12 | root: __dirname,
13 | modulesDirectories: [
14 | 'node_modules',
15 | './app/components',
16 | ],
17 | alias: {
18 | applicationStyles: 'app/styles/app.css'
19 | },
20 | extensions: ['', '.js', '.jsx']
21 | },
22 | module: {
23 | loaders: [
24 | {
25 | loader: 'babel-loader',
26 | query: {
27 | presets: ['react', 'es2015']
28 | },
29 | test: /\.jsx?$/,
30 | exclude: /(node_modules|bower_components)/
31 | }
32 | ]
33 | },
34 | devtool: 'cheap-module-eval-source-map'
35 | };
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2016 Florin Pop
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "quiz-app",
3 | "version": "1.0.0",
4 | "description": "Quiz application built with React",
5 | "main": "server.js",
6 | "scripts": {
7 | "test": "No test",
8 | "start": "node server.js"
9 | },
10 | "repository": {
11 | "type": "git",
12 | "url": "git+https://github.com/Flopet17/quiz-app.git"
13 | },
14 | "keywords": [
15 | "React",
16 | "Quiz",
17 | "NodeJS",
18 | "CSS",
19 | "HTML",
20 | "Javascript"
21 | ],
22 | "author": "Florin Pop",
23 | "license": "MIT",
24 | "bugs": {
25 | "url": "https://github.com/Flopet17/quiz-app/issues"
26 | },
27 | "homepage": "https://github.com/Flopet17/quiz-app#readme",
28 | "dependencies": {
29 | "babel-core": "^6.21.0",
30 | "babel-loader": "^6.2.10",
31 | "babel-preset-es2015": "^6.18.0",
32 | "babel-preset-react": "^6.16.0",
33 | "express": "^4.14.0",
34 | "react": "^15.4.1",
35 | "react-dom": "^15.4.1",
36 | "react-router": "^3.0.0",
37 | "webpack": "^1.14.0"
38 | },
39 | "devDependencies": {
40 | "css-loader": "^0.26.1",
41 | "json-loader": "^0.5.4",
42 | "react-addons-css-transition-group": "^15.4.1",
43 | "style-loader": "^0.13.1"
44 | }
45 | }
46 |
--------------------------------------------------------------------------------
/app/data/data.js:
--------------------------------------------------------------------------------
1 | export default [
2 | {
3 | question: 'What does CSS stand for?',
4 | answers: ['Computer Style Sheets', 'Creative Style Sheets', 'Cascading Style Sheets', 'Colorful Style Sheets'],
5 | correct: 3
6 | },
7 |
8 | {
9 | question: 'Where in an HTML document is the correct place to refer to an external style sheet?',
10 | answers: ['In the section', 'In the section', 'At the end of the document', 'You can\'t refer to an external style sheet'],
11 | correct: 1
12 | },
13 | {
14 | question: 'Which HTML tag is used to define an internal style sheet?',
15 | answers: ['