Vue.js SPA Login and CRUD Operations
Budget: $250 – $750 USD
I have a project which revolves around connecting a Vue.js Single Page Application (SPA) to an existing REST API. The Vue SPA utilizes the Core UI Admin Template
https://coreui.io/demos/vue/5.0/bright/?theme=light#/dashboard
I want a developer to customize the SPA template to:
- Connect the existing login page to our /login API. The token from the response should be stored on the FE, using security best practices, and sent on the Authorization header for all subsequent API calls. After successful login redirect to the main dashboard, upon error show the corresponding message to the user.
https://coreui.io/demos/vue/5.0/bright/?theme=light#/pages/login
- Store the scopes received from the above login API call on the FE and use them to show / hide sections on the SPA. For example, only users with scope USER_CREATE should see the "Create user" page and link.
- Create a logout page that should clear the stored auth token and redirect to login screen.
Ensure that logged out users cannot see anything other than the login screen.
- Customize the Dashboard page https://coreui.io/demos/vue/5.0/bright/?theme=light#/dashboard fetch data from an API that will be provided and draw a simple chart using the data as-is. Remove everything else in there.
- Create a new page to list users from an API. Should support pagination and filtering using CoreUI data table component, page template: https://coreui.io/demos/vue/5.0/bright/?theme=light#/smart-table
Component documentation: https://coreui.io/vue/docs/components/smart-table.html#data-sources
- Within the above page, add support for updating existing customers / creating new ones. The forms should open up in a modal https://coreui.io/demos/vue/5.0/bright/?theme=light#/notifications/modals
https://coreui.io/demos/vue/5.0/bright/?theme=light#/forms/layout. Upon form submission handle the response, showing appropriate error messages (returned from the BE) or a success response when applicable. After adding a new record the list should be updated to reflect the changes.
- Clean up unused views and routes from CoreUI PRO Vue template
[Removed by Admin]
The ideal candidate who bids on this project should be proficient in Vue.js and Typescript. They should have prior experience in dealing with CRUD operations on SPAs. A comprehensive understanding of REST APIs is a must as the project involves connecting Vue.js SPA with an existing REST API.
Key requirements:
- Proficiency in Vue.js
- Knowledge of Typescript
- Experience in connecting Vue.js SPA with REST APIs
- Experience dealing with authentication and authorization on the FE
- Git knowledge, delivery is via PRs on our private git repository guy
https://coreui.io/demos/vue/5.0/bright/?theme=light#/dashboard
I want a developer to customize the SPA template to:
- Connect the existing login page to our /login API. The token from the response should be stored on the FE, using security best practices, and sent on the Authorization header for all subsequent API calls. After successful login redirect to the main dashboard, upon error show the corresponding message to the user.
https://coreui.io/demos/vue/5.0/bright/?theme=light#/pages/login
- Store the scopes received from the above login API call on the FE and use them to show / hide sections on the SPA. For example, only users with scope USER_CREATE should see the "Create user" page and link.
- Create a logout page that should clear the stored auth token and redirect to login screen.
Ensure that logged out users cannot see anything other than the login screen.
- Customize the Dashboard page https://coreui.io/demos/vue/5.0/bright/?theme=light#/dashboard fetch data from an API that will be provided and draw a simple chart using the data as-is. Remove everything else in there.
- Create a new page to list users from an API. Should support pagination and filtering using CoreUI data table component, page template: https://coreui.io/demos/vue/5.0/bright/?theme=light#/smart-table
Component documentation: https://coreui.io/vue/docs/components/smart-table.html#data-sources
- Within the above page, add support for updating existing customers / creating new ones. The forms should open up in a modal https://coreui.io/demos/vue/5.0/bright/?theme=light#/notifications/modals
https://coreui.io/demos/vue/5.0/bright/?theme=light#/forms/layout. Upon form submission handle the response, showing appropriate error messages (returned from the BE) or a success response when applicable. After adding a new record the list should be updated to reflect the changes.
- Clean up unused views and routes from CoreUI PRO Vue template
[Removed by Admin]
The ideal candidate who bids on this project should be proficient in Vue.js and Typescript. They should have prior experience in dealing with CRUD operations on SPAs. A comprehensive understanding of REST APIs is a must as the project involves connecting Vue.js SPA with an existing REST API.
Key requirements:
- Proficiency in Vue.js
- Knowledge of Typescript
- Experience in connecting Vue.js SPA with REST APIs
- Experience dealing with authentication and authorization on the FE
- Git knowledge, delivery is via PRs on our private git repository guy