React App for Sportiq project

This is browser app on React JS for interaction with API of Sportiq project. It is my debut in frontend 😄

Related Sportiq services

• API Gateway
• User Service
• Event Service
• Subscription Service

Examples

Main page

After authentication you'll pass on main page with map of existing events. On hover you can see short info about event. Clicking on the marker will take you to a page with full info. You can use filter for choosing your favorite type of sport or even status of event. Double clicking on the map will redirect you on page of creation.

Event creation

This is simple form with validation. If the event was created successfully, you'll see it on the map.

Created event on the map

If you are the creator of the event, you can change it or even delete. But this behavior is managed by the API, more precisely by the event microservice.

Managing event info

If you are an event guest, then you can subscribe on it.

Event subscription

Tracked events will be in the list of subscriptions. If the event is ended or deletes, it will be added to the history list.

History and subscriptions

TODO

• Add Redux for global states
• Improve optimization

Startup

npm i
npm start