This is a straightforward UI-driven project. It is used to assess students' understanding of JavaScript. They respond to javascript questions and receive scores and comments.
This is the page where students' names are collected. In order to progress. Go Back to the top
This page gives the instructions of the test. Go Back to the top
- Access to a computer or any other accessory such as a phone
- Access to internet
- Clone to this repo : git clone https://github.com/borebrian2021/Moringa-Quiz-Project-Javascript.git
- Unzip the downloaded files in a folder of choice.
- Open the index file from the zipped file with any browser.
- Click this link to view the live application https://borebrian2021.github.io/Moringa-Quiz-Project-Javascript/
- Click this link to view the figma design of this project https://www.figma.com/file/MYat56ANGYAA2FQpkcapnx/Untitled?node-id=0%3A1
- HTML - which was used to develope the structure off the pages.
- VANILLA CSS - which was used to style the User Interface.
- Bootstraps-Used for dealing with page responsiveness.
- JQuery-It was used to add animation to the project.
- VANILLA Javascript-Used to make page interactive.
MIT License Copyright (c) [2022] [Brian Kimutai] Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. Go Back to the top
Linkedin - Brain Koskei Kimutai
Instructions how to deploy the full fake REST API json-server to various free hosting sites. Should only be used in development purpose but can act as a simpler database for smaller applications.
- Press the green
Use this template-button in the right corner - Give your new repo a name and press the green
Create repository from template-button - Clone your newly created repository to your computer
4 . Change the contents of db.json to your own content according to the json-server example and then commit your changes to git locally.
this example will create /posts route , each resource will have id, title and content. id will auto increment!
{
"posts":[
{
"id" : 0,
"title": "First post!",
"content" : "My first content!"
}
]
}
Heroku is a free hosting service for hosting small projects. Easy setup and deploy from the command line via git.
- Easy setup
- Free
- App has to sleep a couple of hours every day.
- "Powers down" after 30 mins of inactivity. Starts back up when you visit the site but it takes a few extra seconds. Can maybe be solved with Kaffeine
2 . Create an account on
https://heroku.com
3 . Install the Heroku CLI on your computer:
https://devcenter.heroku.com/articles/heroku-cli
4 . Connect the Heroku CLI to your account by writing the following command in your terminal and follow the instructions on the command line:
heroku login5 . Then create a remote heroku project, kinda like creating a git repository on GitHub. This will create a project on Heroku with a random name. If you want to name your app you have to supply your own name like heroku create project-name:
heroku create my-cool-project6 . Push your app to Heroku (you will see a wall of code)
git push heroku master7 . Visit your newly create app by opening it via heroku:
heroku open8 . For debugging if something went wrong:
heroku logs --tailHeroku will look for a startup-script, this is by default npm start so make sure you have that in your package.json (assuming your script is called server.js):
"scripts": {
"start" : "node server.js"
}You also have to make changes to the port, you can't hardcode a dev-port. But you can reference herokus port. So the code will have the following:
const port = process.env.PORT || 4000;Not tested 100%. Same as with Heroku, will sleep after a while.
- Register for Glitch or go to Glitch/edit
- Click New Project
- Click Import from GitHub
- Paste
https://github.com/jesperorb/json-server-heroku.gitinto the URL-input and click OK. - Wait for it to setup
- Press Share-button to get your URL to live site. It should be something for example like:
https://fallabe-pie-snake.glitch.me. And your DB will be athttps://fallabe-pie-snake.glitch.me/posts
You can also use Microsoft Azure to deploy a smaller app for free to the Azure platform. The service is not as easy as Heroku and you might go insane because the documentation is really really bad at some times and it's hard to troubleshoot.
The pros are that on Azure the app will not be forced to sleep. It will sleep automatically on inactivity but you can just visit it and it will start up.
1 . Create a Microsoft Account that you can use on Azure:
https://azure.microsoft.com/
2 . Install the azure-cli:
https://docs.microsoft.com/en-us/cli/azure/install-azure-cli
This might cause some trouble, you will see. Remember to restart your terminal or maybe your computer if the commands after this does not work
3 . Login to the service via the command line and follow the instructions:
az loginYou will be prompted to visit a website and paste a confirmation code
2 . Create a resource group for your projects, replace the name to whatever you want just be sure to use the same group name in all commands to come. You only have to create the resource group and service plan once, then you can use the same group and plan for all other apps you create if you like.
az group create -n NameOfResourceGroup -l northeurope3 . Create a service plan:
az appservice plan create -n NameOfServicePlan -g NameOfResourceGroup
4 . Create the actual app and supply the service plan and resource group
az webapp create -n NameOfApp -g NameOfResourceGroup --plan NameOfServicePlan5 . Create deployment details. A git-repo is not created automatically so we have to create it with a command:
az webapp deployment source config-local-git -n NameOfApp -g NameOfResourceGroup6 . From the command in step 5 you should get a url in return. Copy this url and add it as a remote to your local git project, for example:
git remote add azure https://[email protected]/deploy-testing.git7 . Now you should be able to push your app:
git push azure masterYou should be prompted to supply a password, this should be the pass to your account. If not, you can choose a different password at your Dashboard for Azure: https://portal.azure.com/
Choose App Services in the sidebar to the left and the choose your app in the list that appears then go to Deployment Credentials to change your password for deployment:
https://docs.microsoft.com/en-us/azure/app-service/app-service-deployment-credentials
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent