DEV Community: Vaibhav Kubre

Why make a game as a Web Dev?

Vaibhav Kubre — Tue, 06 Feb 2024 00:00:00 +0000

When I was kid we had a Samsung CRT TV. Nothing special about but it had few embedded games. One of it was a game where you shoot from left side of the screen and balloons appear on right side. The moment you miss it's game over. It was bare bones had nothing other than moving ellipses as balloons and no levels or any fancy stuff. But I loved that interactive experience so much, This was the first game I experienced. This got me introduced to video games. After that I played many games and since school I always wanted to make one myself. This was the initial reason even why I decided even to study Computer Science in the first place.

Experience

I've looked into making games before multiple failed attempts at using game engines like unity, unreal or even the one that don't require you to learn code. But due to multiple reasons I really never finished and released something out. Unlike web dev projects where I was not only able to learn and work on vast variety of problems but also able to showcase them and eventually start as freelancer and then as a full time.

I wasn't only looking to just cobble up some code together but wanted add some polish the output. Polish in form of levels, pause options, graphics, and simple narrative and even music if time lets me do it.

Over period of two weeks during my free time I downloaded Godot Engine and reuse one of my old project to make this new game. There were so many new things I ended up learning here are just few,

Trying to come with game mechanics and story.
Making art (I'm not an artist), and frame by frame animation.
Cohesive Art style.
Physics and collision detection.
New language (GDScript) and data structures.

I also so many parallel problems that I already face in web but now in different context.

Managing state of the running game. (I struggled with this a lot)
How to update the state (In Godot you can emit a signal and other nodes can listen to it).
Save and loading game state. (For this game I wanted to store game levels, unlocks and score as a JSON file, I hand wrote serialization and deserialization code for this. Not recommended but certainly fun).
Input handling and feedback on action to the user. (Ex: When player fires cannon, there is small progress bar that empties and then fills up letting user know when they can fire again).
Modularizing code and composing entire game from nodes. (Like components in React)
Building and deploying game.

If you want to find more about the game you can find game design document I wrote for this game here. It's not too big or technical but it's a small overview of what went behind in making the Depot Gato.

🤔 Why make a game as a Web Dev?

Other than personal nostalgia it's just great idea to step out of your comfort zone and try something new. If you're custom to certain flow and knowledge you're not challenging yourself enough. Working on game you get to enter this new domain of unknown challenges and problems. It's a great way to test yourself whether you've grown as a problem solver or you've been merely remembering things. Coding practices to problems would change but the core skills of your ability to solve complex problems by breaking them down to smaller ones and then solving them would remain same.

Did I enjoy this experiment, Yes! Would I do it again Yes!! Would I leave my job and become a game developer full time No! If you're working in certain field and you have been only been programming single language or working on single type of project, you're missing out on so much. This is not just about making a game, honestly you might not even like playing games. But you can challenge yourself in different shapes and form. I constantly like to take look at new libraries, frameworks, languages or even new paradigms, and much more. My goal is to never to be expert in all of those but rather discover in what ways people are solving problems. This was the same reason I gave functional programming a try few years back didn't like it to be turn my self into Monad enjoyer, but to this day I learned to love immutability and iterators, and pattern matching common in functional languages.

This was a short post about me mostly blabbering about my experience hope you enjoyed it.

X does not work and I must use Y

Vaibhav Kubre — Sun, 13 Aug 2023 00:00:00 +0000

So you’re working on something that you usually don't work on, out of your field but you’re going to learn something new. So you dive in. Your entire application has been written over years and is messy and unbearable to look at, so bad you did not let the clean code guy near it in fear of them having a heart attack.

A team call, everybody joins and the manager talks about how our application is unable to scale to meet the requirements. As soon as the requests start flooding in you see the constant stream of 504 Gateway timeouts and you wonder, Why?

Now there are two approaches here. let me take you to the wrong one first (In my objective opinion).

X does not work and I must use Y

So, you think maybe your Nginx server is having issues serving requests, and you scour the internet for a solution you implement multiple solutions suggested to you with no luck, and now the server is handling even handling fewer requests than it did before.

You and the team find yourself stuck and then someone in the team says maybe X is just not capable of handling the requests. They saw big tech use Y in their tech stack. what if we use Y or Y before it? and more variations of this sentence. So begins the journey of throwing in solutions of fancy things that helped big tech scale. But all of you are new to those solutions and still keep having issues with performance. After all this, you keep wondering how others are scaling up easily and you’re stuck in here with the same tech as them.

Also why all the alternatives to Y are like Y but smaller, Y but written in rust, and best one Y with functional syntax.

The “better approach”

You were not wrong in the beginning you tried to think about where the problem might lie in the system. But you did not do one thing you should have started profiling your application while doing the performance testing. The problem in X does not work and I must use Y you failed to get to the core of the problem. You’d probably find sever failing to handle so many requests even despite hardware being more than capable enough was your application was having some tuning issues. Maybe there was a line of code that was performing blocking IOs or regex that was too clever (a personal story for some other day), or too much memory was being created too fast so GC keeps kicking in, etc. Using the results you finally fixed the issues and now the server is having no issues scaling to more requests.

I’m not saying you might never need Y, there is a reason it’s made and its being used. But once you need Y you will find you understanding why you need Y and not I think Y will solve my problem because I think so.

The above example I gave was around ~performance but there are more areas in which this can apply. The example could be you’re doing a rewrite of part of the applications so you end up using something completely new because it’s what is the trend. I’m looking at everyone who completely left server rendering because SPA where all the buzz. Or you heard this new js framework is blazingly faster than the one you’re using, so must rewrite your entire application in it. So many scenarios where people completely switch parts or entire tech stacks without taking time to give thought to their core problems.

I’m not blaming anyone because I’ve done this so many times and I unconsciously do this even today. But now from next time if you’re just deciding to just throw Y at something consider taking in time to understand why is X failing for you.

Level up years of experience before graduating

Vaibhav Kubre — Sun, 26 Feb 2023 00:00:00 +0000

Introduction

If you're currently in college or approaching graduation, you might be wondering how to enhance your skills for your future career or personal development. It can be challenging to know where to start and how to gain practical experience, as well as connect with experienced individuals who can guide you. Fortunately, there are several ways you can gain valuable experience and improve your skills even before you graduate.

List of ways to level up your experience before graduating:

Projects
Internships
Freelancing
Other Activities

Though not in any particular order, I'll be going through each of them and explaining what they are and their pros and cons.

1. Projects

One of the easiest ways to add value to your profile is by starting with projects. If you're a computer science student, you've likely heard of "side projects" or "personal projects." These are projects that you work on independently or with a group, ranging from a simple website to a complex application. The goal is to learn something new and apply it to your project, and you can use these projects to demonstrate your skills to potential employers or clients.

Projects offer a great opportunity for continuous learning and growth. When it comes to selecting a project to work on, it's entirely up to you. However, if it's your first project, I suggest starting small, ideally, something that can be completed within a week or two (ex if you want to be a web developer simple Shopify, medium, notion clone). This will help you get a sense of what it's like to build something from scratch, as well as teach you the basics of the tools you're using. Once you've finished your first project, you can move on to larger and more complex projects.

What is the limit? How many projects should I have?

There is no limit to how many projects you can have. The more the better(generally). But I would recommend having at least 3-4 projects. This will help you showcase your skills and also help you learn new things. If you're applying for a job don't be discouraged while you're in the middle of building these projects.

2. Internships

In my opinion, internships are the best way for college students to gain practical experience in their field of study. However, the tricky part is getting one in the first place. Usually, you would have to go through an interview process, which can be challenging for some people, especially if they don't have much experience or are unsure of what questions to expect.

Although this post is not about how to land an internship, the first step is to start building projects. Creating and sharing personal projects on platforms like GitHub can showcase your skills and demonstrate your passion for the field. This can make a significant impact on recruiters who are looking for candidates with experience and passion for the work.

But why are internships so valuable? Landing a good internship can provide you with the opportunity to work in a team, with a clear direction, and typically with a deadline. This will allow you to learn so many essential skills, such as how to break down projects into smaller requirements and see how different people approach them.

Moreover, you will have the opportunity to work alongside experienced professionals who can guide you and answer any questions you may have. Always remember to focus on understanding the problem rather than merely solving it. Take your time to think about the best approach and ask for guidance when you feel stuck.

In an internship, you don't need to rush to complete tasks as it is not a competition or a race. Instead, take the time to understand the problems thoroughly and think about the best ways to solve them. This will enable you to learn more than you ever imagined and help you develop the confidence needed to excel in your career.

3. Freelancing

If you don't want to work in a company and have a business idea, freelancing might be a good choice for you. As someone who paid most of their college tuition fees with the money earned from freelancing, I can attest to the fact that it is an excellent way to learn and grow.

During my time freelancing, I gained a variety of valuable skills, such as understanding people's problems, collecting requirements, creating proposals and bargaining, estimating the time and cost of building projects, balancing my college work and freelancing work, working with people from different industries and specialties, delivering projects, applying feedback, and handling expectations when things take the time or go wrong.

Freelancing made me a better engineer overall, and I still believe it is one of the best ways to learn and grow. While there are several ways to find freelancing work, I usually worked with people I knew or those referred to me by previous clients. Helping local businesses with their websites and apps can be a great way to get started and feel like you're making a difference in your community.

However, freelancing also has its challenges. You may only get in small, one-off projects that don't allow you to learn new things or get trapped in a large project that lasts for years. Additionally, freelancing can be a solitary experience since you have to do everything on your own, which can help you develop a broader range of skills, but you may not specialize in a specific area.

Despite these challenges, I would still recommend trying freelancing to learn and grow as a professional. While there are websites to help you find clients, most of them do not allow you to meet the actual clients, making it difficult to build your network. Nonetheless, a few of my friends have built their businesses out of freelancing, making it a viable career choice for those who want to work for themselves.

4. Other Activities

In my opinion, participating in college clubs, hackathons, competitions, and conferences can be a great way to enhance your skills and confidence. These activities often involve collaborating with other students and professionals, which can allow you to solve problems together, divide tasks, and learn from each other.

While these experiences can come with challenges such as different ideas and getting stuck, overcoming them can help you grow and develop valuable skills for handling similar situations in the future.

Although these activities may not offer a clear sense of goal or monetary reward, they can complement internships and freelancing. Participating in competitions can also provide a benchmark for improvement and offer the opportunity to travel to new places.

In conclusion, taking part in college clubs, hackathons, competitions, and conferences can be a valuable addition to your skill-building journey.

There are other options like courses, etc but these are the ones I highly recommend. If you chose one or all of them, don't forget to understand your limits doing too much will in end just exhaust you, which will lead to burnout. This can hold you back and you might lose confidence in yourself.

Learn JavaScript and use Typescript

Vaibhav Kubre — Sun, 03 Jul 2022 00:00:00 +0000

Experience

You're comfortable with javascript now. You've finally been able to learn the fancy functional methods. Write out the reduce() instead of a loop. It runs the same as a loop but makes your code look smarter. But people are shifting to something else now. It's typescript! It's just like JavaScript but better. How? Well, you see, it has a type, “Pun intended.” So you jumped on the hype train and started a typescript project. But it felt off. You're writing code that does the same thing as JavaScript but amounts to far more code. You wonder if it was even worth the trouble. I'm going back to the good old javascript and living in a typeless environment. VS Code no longer provides intelligent suggestions, but it did, and the simpler mistakes you pass around are null and undefined and no longer being caught. But does it have to turn out this way?

So, how do I get started with Typescript?

Learn javascript and use typescript , Yes the title of this blog post. What does it even mean? Just write JavaScript inside the typescript file.

That's it!

Let's understand with an example.

const allPosts = [
    { title: "Post One", category: "one" },
    { title: "Post Two", category: "two" },
];

function getPosts(category) {
    if (category) {
        return allPosts.filter((post) => post.category === category);
    }
    return allPosts;
}

console.log(getPosts());
console.log(getPosts("one"));

I'm using vscode which has a linter built-in. It lets you know the issues with Javascript or TypeScript directly in the editor itself. With the default configuration for typescript (i.e., if you used one from npx tsc --init will show you an error at the getPosts() function call with a warning An argument for 'category' was not provided.

But we know our function does handle cases when the category is not present. But typescript doesn't. By default, it will treat the argument as a required parameter. We can just add ? at the end of the category and let the typescript know an undefined state is considered.

function getPosts(category?) {

Linter will also complain about the category being type any. If you don't know it means in simple terms your variable can hold value with any of the types javascript supports. Let's change this behavior. We know that category is a string, so we can explicitly type the argument with a string datatype.

function getPosts(category?: string) {

Linter is no longer complaining, and we are good. Only those changes? Yes, One of the best tips I've gotten looking at projects built by people who use typescript on daily basis, and even the advanced user just writes javascript and lets the typescript infer if it complains then add the type. This way the learning curve is minimal.

If you go deep, you will find it interesting to learn but difficult to maintain for day-to-day coding. And that's fine! All those fancy features that Typescript provides are for people who write and maintain packages. That is how we receive the great linting and the sweet IntelliSense. But for people who are building user-facing websites and applications, getting the typescript compiler happy is enough. Once you start using it on every project you will learn new things in typescript but it's a slow and gradual learning curve. You will only learn what you will use in the project.

I had a hard time starting with typescript at first, but now I've switched over to full-time. by simply only adding in types when typescript complains about it. And every other time, I just let typescript infer the type for me. This is called implicit typing, and it helps a lot to reduce the amount of code that doesn't add any features for the users. This also keeps you from getting strictly locked into the typescript itself. At work, I still have to use JavaScript, and it won't go anywhere soon. Javascript is improving day by day and people will keep using it. Some are moving back to Javascript from Typescript also.