Inspiration
I myself have been trying to get more into coding over the past two years. Mainly, my experience comes from my amazing dad who has worked with code for almost all of his life. The rest comes from self taught coding lessons and a lot of tiny mistakes that made me think something was fundamentally wrong with whatever I coded, or my ability to code. I wanted to create this project because I realize that a lot of people aren't as lucky as me to have a dad who has the time or capacity to teach them how to code, So I wanted to offer an interactive way for beginners and intermediate learners alike to learn how to code. I took heavy inspiration from a website called freeCodeCamp, a website I'm currently using to improve my python skills further, but as I progress through their premade exercises and examples, I noticed two main things: The examples they have are the same, and don't account for how people want to implement their own ideas and creative thoughts into what they are working on, if they want to add something, they have to either trial-and-error their way through it by themselves ( which can be really challenging!) or ask for AI's help, in which case they get the answer , but not the experience necessary to learn how to build their own projects in the future. the second problem, is that if you make a mistake on one of their exercises, they have one line hints on how to solve your bugs, and they oftentimes are not very accurate. our app aims to solve both of those issues through our implementation of AI, and an IDE together. (more in the next section)
How we built it
This was created with Antigravity. The functionality of our website is that the user can ask the AI for a project idea, or tell it their project idea, and based on what the user answered for their coding level ( beginner, intermediate, advanced), the AI takes that into account, and teaches the user how to do what they asked it to. If they answered beginner or intermediate, the AI will start by first teaching them the concepts necessary to understand what/how they will be creating their project. It does this by opening a separate file and showing the player demo code of a concept, like functions ( varying how it teaches by what language they chose to write their code in), and walks the user through every line of code, explaining how they work and leaving the chat box open for any additional or more in-depth questions. After this, it takes the user back to their main file and lets them start writing the lines of code for their project with their newfound knowledge. After writing their demo code, or needing a hint, they can either ask the AI an in-depth question, or simply press the button to check for bugs and explain any that it found and how the user should go about to fix them. The implementation of the chat box in all of this plays in throughout the coding as well because of how the user might change or want to take their project idea further, like after finishing some unity code(c#) for enemy ai, they might want to add a spinning weapon to their enemy, which the AI can walk them through how to add, and then teach them how to code and add that as well.
Challenges we ran into
Challenges we ran into were trying to get the concept of the AI down right, with only a week of time, our main problem was that our AI wasn't budging the player enough on how to code, and required a lot of question asking to get explanations and answers. This defeated the point of our app, because it was suppose to walk you through what you were doing, highlight code, check for bugs and explain them to the user. The constant poking of the AI created a nagging sensation, which was the opposite of what we wanted. Although we weren't fully able to fix this ( as this would require a lot of training on actual scenarios and constant updating), we did get it to prod the user more and more each time. Another big issue we had was the AI itself, as the model wasn't powerful enough to comprehend the
Accomplishments that we're proud of
An accomplishment that we are proud of is how we were able to implement the AI into the IDE and give beginners the sensation of accomplishment when creating something, because they were "thrown into" that once scary open file where you had no guidelines, and learn how it actually works and be able to start creating your own projects. The closest metaphor, would be the sensation of giving your kid a pool float, or teaching them how to tread water, and being allowed to watch them swim, no matter how basic it is, its a first step thats a major improvement from standing up in the kiddie pool. This project is what I would of loved to have when I was first learning code, simply because it can grab the creative projects I was impulsive about creating but when trying to code had no idea, and actually allows you to experience what it would be like to make, without having an abundance of previous knowledge.
What we learned
We learned that education is more important than ever in this growing time of AI. Education ( especially on coding and AI itself) is the pinnacle of our future; its constantly changing and the temptation to just let AI do everything just grows and grows, as everything seems too hard to start. too much experience needed. Too much, that we tell ourselves we just don't have. We learned just about just how intimidating learning seems and feels to people who are trying to "catch fire". My own partner on this project actually argues he doesn't know how to code and isn't very knowledgeable on coding. About how he tried to start learning and it was just so overwhelming to get the grasp of. Its easy to overlook this with all the experience we gained, but the gap is only growing with the more experience we require.
What's next for CodeSkillTree
Regardless of the outcome of this hackathon( feedback is obviously very much appreciated!), me and my partner will develop this app more and genuinely try to add more to this. In the sense of app features, I want to improve the UI and AI for the website, as it has a very simplistic look for now, and I want to create a more concise and to-the-point AI that still leaves a lot of room for questions, and is still easy to understand and allows beginners to ask for more examples or how to apply concepts in combination with each other.
Built With
- antigravity
- javascript
- monaco-editor
- vite
