Event Scheduling App
During the extracurricular section of Front-end Udacity Nanodegree on which we needed to create a event scheduling app applying the best policies to forms and inputs making intuitive and accessibility.
Thinking simply I choice the ReactJs library to write my App, and to persist my data I used the Firebase Realtime Database that on which provide us all infrastructure of a Back-end of easy use.
So, I figured out which inputs were "required" to complete the event's form and so I used the Required attribute. As well as the input that can be auto-filled, to use the autocomplete attribute.
To make the App more accessible to the assistive technology I made sure to apply all labels or aria-labels in each input.
In this App you can, create a new account, make log in, create a new event, see all your events registered, edit any event, delete any event and see a detailed event.
Getting Started
To test this App in your machine, just follow the steps below:
As I used a Firebase Database, you need to create an account there and after create a New App to configure the Database Realtime using something like that provided by own Firebase:
// TODO: Replace with your project's customized code snippet
var config = {
apiKey: "<API_KEY>",
authDomain: "<PROJECT_ID>.firebaseapp.com",
databaseURL: "https://<DATABASE_NAME>.firebaseio.com",
storageBucket: "<BUCKET>.appspot.com",
messagingSenderId: "<SENDER_ID>",
};
This config is used in src/server/index.js in the root of this App to initialize the Firebase service.
After this, clone this repo in your local git clone https://github.com/elfiservice/create-events-app.git
Now into your folder project in the terminal exec npm install to install all dependecs
After just exec npm start to execute the App in the browser.
Technology
- HTML5
- CSS
- Javascript
- ReactJs
- Font Awesome
- Firebase Database Realtime