A productivity tool focused on new Beginnings: Skill Tracker

This is a submission for the GitHub Copilot Challenge : New Beginnings

What I Built

Skill tracker: An app that will help to track and manage the skills and goals of New Beginning in simplistic way.

Features

• Add your Skills and Goals.
• Set Start Date and Deadline.
• App shows the days left to meet deadline for awareness.
• A progress bar to update the learning progress in visual.
• Save important links of resources for your study.
• A clock to stay aware of passing time/second
• Edit save or Delete skills that no longer necessary.

Demo

https://nileshroy200.github.io/Skill-Tracker/

Repo

https://github.com/nileshroy200/Skill-Tracker.git

Copilot Experience

Without Copilot this challenge was almost impossible to me to build in One day. Here's How I used Copilot through my building process.

1. Worked with Document Object Model. Added JavaScript to selecting Element, dynamically change and update content through Event Listeners.

2. Created function to generate and add new card for skills and Options to Edit, save and delete.

3. Solved problem to save link to input field that will show the corresponding placeholder text instead of the link directly, works as a button to redirects to page following the saved link.

4. Logical errors are difficult to figure out. By writing clear, concise prompt, Copilot assisted it better to navigate understand and fix it.

5. Smoothly able to fixed Errors by directly refereeing the console error message in the chat.

6. Built Logic and Math for Time calculation and Tracking functions and update date format.

7. Figured out the issue I encountered, while pushing changes to GitHub repository.

8. Explored new property attribute of different HTML form elements to make feature work well. Used inline chat to write CSS Better.

9. Used agent like @wokdspace, @terminal and /fix, /explain command through out the building processed.

10. Used the chat to discussed about doubt, how things are working in the process of building. It helped me to understand to the point.

11. Used Inline Chat for CSS and HTML

My Best Experience

• Fast Problem solving
• Brainstorming and Learning while building.

GitHub Models

I did not use any GitHub Models

Powerful lessons I have gained

1. The power of learning through building than just watching tutorial with tiny practices.
2. This is the new way using the power of AI to learn and build fast than traditional way. ### Technical Lesson
3. Learned about New CSS Property and HTML attributes
4. Learned about JavaScript DOM Manipulation, working with event listener/handler and more.
5. Learned about Copilot Of course and how to work with AI and utilize it.
6. Learned about Git, GitHub, how to host and deploy with GitHub pages.

Conclusion

This is my first build experience with a Basic Project. I am Nilesh Roy, started learning recently as a self-thought, standing in beginner level. With this little Basic Project I have gained some exciting experiences and insights about smart work, high productivity, building process, problem solving, planning and how to work in short time, utilising the AI.

I joined Dev.to at the beginning of this year, few days ago I noticed this challenge and decided to participate, but lack the confidence as it was out of my present capabilities just with HTML, CSS and Basic JavaScript knowledge. But decided to submit this challenge and I'm very thankful for this now and to our beautiful buddy GitHub Copilot.