codegummy

[codegummy]

Game with HTML Canvas and Vanilla JS

Been a little stressed out with school and all so I made a little project to cool off a bit. I followed this YT tutorial showing how to code the Google dinosaur game. But then I made new vector illustrations to use instead of a the ones provided in the source code . To give it a touch of cuteness ⸜(｡˃ ᵕ ˂ )⸝♡

[codegummy]

Valentine Coding Challenge ( ˘͈ ᵕ ˘͈♡)

Valentine project (challenge by @izicodes ) using HTML, CSS and JavaScript. I'd wanted to use React but I was like Okay first lemme code with Vanilla JS and see if I actually can, then I'd code it in React. Of course it was a terrible plan because now I'm tired. I could do it tomorrow but... I wanna do something different. Am I the only one who gets bored like that?? (ᵕ—ᴗ—)

Description

So it's the old FLAMES we used to play when we were younger ( and had no worries ) . You cross out the letters that appear in both names and then you count the number of remaining letters. You go over the letters of FLAMES starting from zero. The letter you end on is the future of you and your crush / friend-at-sleepover / celebrity-who-doesn't-know-you-exist (˵ ¬ᴗ¬˵) .

I hope I've explained it well....I think not but you get the point (ㅅ´ ˘ `)

[codegummy]

Monday 29th January 2024 - Projects selection

Hello приветик~! I'm finally starting my #valentinecodechallenge! I need to present a project by next Monday, which will be the first full week of February. But this post is just about me declaring to myself what 5 projects I came up with that I want to create for this challenge!

more information about the challenge >> click

My Chosen Projects

LoveMatch - a memory card game where you upload 3 pictures of you as a couple to be the playing cards~!

Izzy's Love Lines - Simple page with a list of my favourite romantic lines/quotes from History/TV/Movies/Anime/The Bible, etc

Pair Perfection Calculator - a bit like relationship compatibility calculators (This could be fun, a bit like those 2000s celebrity-crush compatibility calculators they had in magazines)

Cupid's Greeting - "Will you be my Valentine?" card opening CSS animation page thingy

ILUVU - a page that has "I love you" in different languages. You can even click and copy the text~!

That's all! I think this challenge will be all I post until the end of February! Sorry, not sorry!!

Also if you can code, you should totally join! Even if you make just one project! I really made the challenge for myself to work on but do join if you have small ideas for St Valentine's Day!

[codegummy]

[codegummy]

My first Tailwind Project⸜(｡˃ ᵕ ˂ )⸝♡

I thought Tailwind would be difficult and all but it's really just CSS. It gets a lot of hate sometimes but I think it's pretty cool and concise, though the large number of classes can get messy..But it's worth it!

Thanks to @izicodes and @lazar-codes I FINALLY got my Gitpages running so here's the link to the project.

I wanted to say one more thing...I've forgotten....ughhh (•-• )>

Aha, the project is a beginner challenge from frontmentor.io. Terrific website providing frontend projects for we who suck at design.

[codegummy]

I love this book. I'm still reading it and I just love it. I feel like I have been immersed into a world I never knew existed. A world of different cultures and different lives and different perspectives. It's made me think a lot about colonialism and the effect it had on the customs and the everyday lives of those affected. How rich our traditional lives were before 'the men with the hair like straw' arrived. It has really got me thinking about a lot of things.

[codegummy]

Valentine Coding Challenge!

This challenge initially started as something I wanted to do for myself because I love February vibes – plus I love challenges... even if I don't stick to them all the time hehe. But hey, I love to be extra so I made an info sheet/post thingy! Yay~! I thought it would be fantastic to share and invite anyone interested to join in~! Or just watch me do the challenge... :p

As a Christian, I love exploring the deeper meanings behind celebrations. That's why I'm aiming to dedicate at least one of the projects to the two priests named Valentine~!

Anyhoo, can't wait~!

[codegummy]

Thank you both so so much💕💕

I didn't add the homepage property to the package.json file and that's what was causing the issue ( and stress!!! )

I'm super grateful😘😘

My first React project wooohooooo!!!

Well technically it's not an original project. It's our first solo project in the React course. But I made it a lil' different.

I'm still very proud anywaysss yupeee!!!

______________

Time Management

I find that the Pomorodo technique works very well for me. I usually forget to take breaks when I work and end up getting way more exhausted than necessary. So having a Pomorodo app on my phone helps remind me to. And it makes me feel very rewarded when I'm able to concentrate fully during the 25 mins, without getting distracted . I personally find I prefer to have three 25 minute blocks followed by the 15 minute break, instead of the usual four.

[codegummy]

Thank you soooo much 💕💕

Yuppp, I've learnt a bit of Git. Really the bare minimum. And I have a few repos on GitHub. But I'm not so comfy with it yet. I tried running this site on GitPages and for some reason it didn't work out. I was too tired to figure out why..... maybe later😂

My first React project wooohooooo!!!

Well technically it's not an original project. It's our first solo project in the React course. But I made it a lil' different.

I'm still very proud anywaysss yupeee!!!

______________

Time Management

I find that the Pomorodo technique works very well for me. I usually forget to take breaks when I work and end up getting way more exhausted than necessary. So having a Pomorodo app on my phone helps remind me to. And it makes me feel very rewarded when I'm able to concentrate fully during the 25 mins, without getting distracted . I personally find I prefer to have three 25 minute blocks followed by the 15 minute break, instead of the usual four.

[codegummy]

My first React project wooohooooo!!!

Well technically it's not an original project. It's our first solo project in the React course. But I made it a lil' different.

I'm still very proud anywaysss yupeee!!!

______________

Time Management

I find that the Pomorodo technique works very well for me. I usually forget to take breaks when I work and end up getting way more exhausted than necessary. So having a Pomorodo app on my phone helps remind me to. And it makes me feel very rewarded when I'm able to concentrate fully during the 25 mins, without getting distracted . I personally find I prefer to have three 25 minute blocks followed by the 15 minute break, instead of the usual four.

[codegummy]

Wheeewww what a week!! I started to learn React and lemme tell you...it hasn't been easy due to my own silliness . I had already tried to learn it earlier last year and I thought I had still retained most of the concepts I needed to start beginners' tutorials ( ignore the gross overestimation of my capabilities) . Boy was I wrong......

So after watching hundreds of tutorials (okay maybe just three hehe.....), I decided to relearn React. Which was really the best thing to do, because I feel clearer in my head now (*ᵕᴗᵕ)⁾⁾.

While I was stressing with React, I decied to learn HTML Canvas as a way to cool off, because aside scrolling through Pinterest, I have zero relaxing hobbies; they're all so active! Okay that's a lie, I read. I'm currently reading David Copperfield but I've got to a particularly sad part and I really can't continue ಥ﹏ಥ. So HTML Canvas came in to save the day. It's really really fun and I love love love bouncing balls.

I followed a YT tutorial by Chris Courses. He has a playlist on the topic which is sooo useful. 10/10 will recommend!

Oh yes, before I forget, here is the link to the React tutorial I'm currently following.The course is on Scrimba but I preferred to follow it locally. I'm old school like that.

Wish me luck everyone.Love love love ⸜(｡˃ ᵕ ˂ )⸝♡⸜(｡˃ ᵕ ˂ )⸝

꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒷꒦꒷꒷꒦꒷

PS : Anyone have any good classics recommendations? I'm tryna become 'cultivated and well read'. And no, not just 'Western' literature. Stories from all over the world would be greatly appreciated 𓆩♡𓆪.

[codegummy]

My Favourite VS Code Extensions

This actually started with a conversation about favourite VS Code themes which got me to thinking. But as always I had to be that little bit extra. So, here are a few of my favourite VS Code extensions that I think would be particularly helpful for new coders or folks just starting with VS Code.

These are in no particular order! I've tried to keep the list to extensions that help read your code and make thinsg pretty. There are hundreds of extensions for almost every type of code, but I wanted focus on ones for beginners. Ones that won't encourage you to become too lazy relying on shortcuts. So, with no further ado, here we go:

Colorize

This extension will highlight any colours (hex, rgb, hsl etc) in your code.

Auto Rename Tag

Okay, this one might make you a little bit lazy. Sometimes you need to switch things up, and that can start to get complicated if you're working on a lot of code. This extension will change the opening or closing tag name paired with the one you manually change. It prevents mispellings that will break your code and makes life easier.

Spellcheck

Ever typed heder instead of header? Or justfy-content instead of justify-content? Well, this extension will help pick up on those typos and keep your code clean (and working!).

Indent Rainbow

This is such a small thing, but possibly one of my favourites on the list. Indent rainbow does pretty much what it says on the tin, adding a coloured line down the lefthand side along the indent of your code. It looks pretty and helps easily keep track of where you are.

Color Picker

Who doesn't love beautiful colours? Colour Picker lets you choose all the beautiful colours you could want without having to leave VS Code.

HTML Checker

This extension helps prevent errors by checking your code against the W3C Markup Validation Service searching for errors. Great of avoiding issues further down the line. Useful for beginners and pros alike to be honest.

Rainbow Brackets

I tend to find this one more useful in javascript, but it's good for everything. I used to use another, also called Rainbow Brackets but that's been depricated, and I like the default colours in this one. There are a few, so shop around.

Prettier

This extension forces a set format on your code, keeping things neat and tidy. It can take a little getting used to but the documentation is pretty good. Helps build good habits, keeping things uniform and easy to read.

These are just a few of the ones I've personally got installed. As I mentioned, there are hundreds of different extensions. Many of which will do the same thing. So, make sure you have a look around and find what works best for you!

Which extension would you recommend for a beginner?

[codegummy]

Video on coding using Pinterest~!

Saturday 13th January 2024

Let's go! I made another video on my empty YouTube channel! I made it on a whim because I was explaining to my Dad my workflow when I was coding my own projects + I got a reply a couple days ago with the same question + I love talking so I made a video :3

I made a post about what I talked about in the video but again, I like talking so I made a video also! Editing the video doesn't take that long, it's just under an hour, I don't do anything fancy so probably why it's short! ˙˚ʚ(´◡`)ɞ˚˙

Anyhoo, hope you like~!

[codegummy]

ToDo List Project

Extremely satisfying . I think I'll move from just Vanilla JS to incorporating frameworks into my next projects

[codegummy]

Second major project. A quiz app with questions and answers fetched from an API. I used this video as inspo ...

And the tutorial source code :

I didn't follow the tutorial line for line because I wanted to challenge myself. And boy was I challenged!! It was frustrating ( I use this word like 5 times per post ヽ༼ ಥ_ಥ༽ﾉ!!!) but it was very worth it. There were some areas I just could not figure out so I took a peek at the tutorial code.

꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷꒦꒷

My fingers hurt...literally. And I'm sure my spine is broken.....

But I'm very proud ( ꈍ◡ꈍ)

[codegummy]

A lil' game of tic tac toe. My back hurts so badd(╥﹏╥)!!! I followed this tutorial

Absolutely love his channel.

I first watched the tutorial to get a general overview cos when I tried to code it on my own...hehe...I got stuck pretty early.

After watching, I tried to code it on my own and failed!

SoI coded along with the video. Then tried to code it on my own and failed!

Had to go and rewatch certain parts twice over. By this time it was midnight, I was tired and frustrated and thinking I was as dumb as dumb gets, so I went to bed. Woke up energized and ready to tackle it and I finally succeeded(ง ͠ಥ_ಥ)ง.

After getting the main parts down, I just added a few things to make it pretty and tadaaa!

It was a very rewarding project, though I wish I had been able to come up with the solution myself. But we move on!!!( ◡̀_◡́)ᕤ

[codegummy]

Free and Detailed Developer Roadmap

Guyss, Developer Roadmaps - roadmap.sh. is the best roadmap guide for frontend, backend, AI/ML,etc and individual languages like Python, Jva, etc. Absolutely worth cheking out.

You can track your progress AND learn the best coding practices. It's pure gold!

I love the Internet (´▽`ʃ♡ƪ)