Inspiration through past struggles
When I started programming I ran into plenty of issues surrounding runtime errors, compiling errors, and more. Every time I searched online for answers I could never find an exact or clear answer as to what was causing the problem because I didn't know what to search. This would extend to when I used Git and GitHub for the first time too. Git never made itself clear to me when I started using it so I didn't know what key phrases to search up when I had an issue.
After talking to other peers in person and online, I found that this issue was very common among beginner programmers. Seeing how I struggled before, I made Technical Lifeline in hopes that it can help new beginners to programming figure out the roadblocks that may stop them early in their career and allow them to progress with confidence!
What it does
Technical Lifeline acts like a web app, mimicking a FAQ page. The user can navigate the simple looking website and choose if they're looking for general coding help or Git help. This will lead the user to a second node or page with an assortment of set questions that they may have. Clicking on the question will lead to a page that answers why the user may be encountering this problem and how they can fix this problem. It may also tell the user key phrases or what to search on Google if they need more information.
Technical Lifeline also currently offers coding support for three languages: JavaScript, Java, and C#.
How I built it
I planned for the project to be a web app from the start for two reasons. The first reason was that I believe a project like this would thrive best as a web app. The second reason was because I wanted to get more experience using HTML, CSS, and JavaScript. These were languages that I've recently learned and I wanted to try my best to use them for a larger project.
Most of the program was written by me using my knowledge and experience, but not everything was written by me. I had some aid from GitHub Copilot which helped me by explaining and giving example code for me to reference off of. For example: nearly all of the CSS file was written by GitHub Copilot, done to give me a template for the website's appearance. I only made minimal changes to font size, font colors, and box colors.
Challenges I ran into
Because this was my first real attempt at making a web app on this scale, I was faced with the challenge trying to figure out how to write the app logic for the website to work. I did my best to use what I knew and apply it as best as I could. It was a lot of trial and error testing to see if the app was functioning properly. In an ironic twist, I even encountered the same problem that Technical Lifeline was trying to solve, that being I didn't know what to search for to get help. For example, I had struggle trying to implement support for multiple coding languages. I didn't know how to implement the logic to include the ability for the user to switch to what language they wanted help with.
Thankfully, this was where GitHub Copilot helped me. If I was stuck and couldn't find my answer on how to implement something, I asked Copilot to give me an example code that replicated the logic I wanted. Using that example code as reference, I was able to finally get the multiple language support to work. It still took multiple attempts, but I managed to get it there.
Another challenge I faced wasn't a coding issue, but an explanation issue. I had a pretty hard time trying to figure out a simple way to describe solutions to the questions implemented in Technical Lifeline. I wanted these answers to be simple yet helpful. I managed to overcome this by watching multiple videos of other programmers explaining the solutions in their own way, and seeing what was the most common phrasing used. Then I mixed those common phrases with my own flair or way of speaking while keeping it simple. No using fancy words.
What I learned
This hackathon alongside the experience of making this program gave me much more insight on how to use HTML, CSS, and especially JavaScript. I feel like I've learned more about the JavaScript syntax as well as what JavaScript can do. This was the first time using JavaScript for app logic in a more complex way. Writing this program and participating in this hackathon has allowed me to learn more about web development, and has made me more eager to learn about web development.
What's next for Technical Lifeline
Technical Lifeline is a web app I do want to add more to. Currently, it only supports help for JavaScript, Java, and C# and that's largely because those are three languages that I do know about, so I'm familiar with the syntax and errors. As I learn more languages like C++ and Python, I want to add support for them for beginners who are starting in these languages.
As of now, Technical Lifeline doesn't have a host. It can only be ran by cloning the program through the repository then running it via a live server through Visual Studio Code. Eventually, I would like to see Technical Lifeline on a host site so that programmers who aren't savy with programming yet, or programmers who don't like Visual Studio Code are able to access the web app.
I do want to find a way to "streamline" or make the actual code that handles the questions and the answers look less clogged and messy. The current file that handles this aspect of the web app (script.js) appears a bit messy and takes up many lines of code. If it's continued to be handled this way, especially as support for new languages arrives, that file may get extremely cluttered and could result in issues.
Lastly, I do want Technical Lifeline to tackle more complex issues. Right now, the web app only has answers for very common and simple questions, which is the original goal I had when making this program; Technical Lifeline was meant to help beginners. However, I would like for the page to help programmers and hackers of all ranges of experience. Perhaps when I become more experienced myself, I can implement this.
Log in or sign up for Devpost to join the conversation.