Badgeyay project is divided into two parts i.e front-end with Ember JS and back-end with REST-API programmed in Python.
Badgeyay has many features related to enhancement in generation of badges. It gives choice of uploading data entries i.e by CSV or manually. There are options available for choosing Badge Background and font specifications. Now the next important thing from User perspective is that there should be a feature in My badges panel where user can see all badges & other details and should be able to edit them if he want to, so moving forward with this feature I have implemented Badge Name update functionality in the frontend.
In this blog, I will be discussing how I implemented Update Badge Name functionality in my Pull Request so that the User can change his Badge Name at any point of time in my badges panel.
Let’s get started and understand it step by step.
Create Badge Name component with Ember CLI.
Make changes in Handlebar of Badge Name. We will be using semantic UI form for making the changes in Handlebars.
We have used action on submitting the Form for changing and updating the Badgename in Database.
We will now define the action in badge name JS file. We will also add the validations in Form so that empty form cannot be submitted to the server.
We will now configure the controller to customize the action that we have defined above.
Now, I am done with doing all the changes in Frontend.
Now run the Frontend & Backend to see the implemented changes.
- My Badges Panel
- Ember Docs – Link
- Badgeyay Repository – Link
- Issue Link – Link
- Pull Request Link – Link
- Semantic UI – LInk