How to start thinking like a programmer?

Developer Showcase
1

Hi everyone, hope you’re doing great.

Since at least 2016, when I was studying linguistics and translation at uni, I became fascinated with programming. This is not the only field I’m fascinated with — I like space, dinosaurs, video games, music, you name it.

10 years go by. I know a little bit of Python, HTML, CSS, I use CMD on my computer a lot. I’ve even created some small scripts for my work as a copywriter. I’ve also been following FCC for many-many years now, trying to go through the curriculum to no avail.

But when my wife told me if I could make a small website for her, I opened up Visual Studio Code and my mind went blank. I couldn’t even remember <DOCTYPE! html> or how to link to styles.css. And after a while I just couldn’t resist using AI to make all the work for me, especially CSS as I’m not very good at styling webpages.

Before the AI era (late 2010s), I could sit half a summer in front of my old laptop, using some GitHub repositories and Python libraries to make my own web crawler in Telegram. It seemed that the problems I’ve encountered were only mine as there were no posts about them on Stack Overflow. The final result was a Frankenstein monster, but it worked most of the time. I was the creator with the big C. This web crawler helped me a lot — now I didn’t have to manually look up websites of our competitors for interesting news.

Another example is when I created a DIY music box with Raspberry Pi in it for my girlfriend’s B-day. When you plug it in, it starts playing a few of our favorite songs. And one of the songs was a self-made version of The Legend of Zelda - A Link To The Past - Fairy Fountain. Instead of just copying an .mp3 file to the SD card, I’ve coded the whole theme with Sonic Pi. I had to look through the original charts and recreate them, which took me many days. And in the evening before the B-day, I encountered some bugs like when one song starts playing on repeat with a small delay. And as I used a headless version of Linux, the only option I had is to look at CMD and google my problems. Again, it seemed like I was the first person on the planet to think about doing such a music box with Sonic Pi. In the end, it all worked, I was in tears and overjoyed.

With all of that in mind, when you give me a task like ‘Create a calculator’ or ‘Make the simplest version of a tic-tac-toe game’ — I’m physically and mentally not capable of doing it. When I see a task like ‘OK, center this div with a form in it, make it a bit pretty with box shadows’ — it’s game over for me. I know that in 5 to 10 minutes when I get bored or encounter something I haven’t learned or forgot, I’m gonna close the tab, I’m gonna delete VSC from my PC and call it a day.

And I wonder, what is the solution to my inability to go through the FCC curriculum? How can I find joy in theory, tasks and examples of code that are not related to my real life? How do I force myself to sit in front of the PC to learn new code when the only thing I’ve been doing for the past 6 years is to sit remotely in front of my PC, writing and rewriting news articles? Has anyone else encountered at least some of my issues?

Looking forward to all of your replies:)

2

You could use all sorts of physical restraints to tie you down to your chair and force you to sit there. But that probably isn’t what you actually want to do lol.

I usually use a few analogies when talking about challenges and how to tackle them. Mostly because I believe being able to view the problem from “the outside” can give some insight into what is going on “inside” of the problem, IE what you are facing.

My favorite one is programming is like cooking. I believe it works well because both are skills that require just raw experimentation, and dedication to actually learn it. You need to cook to learn how to cook, same way you need to build to learn how to build. You can’t become a great cook just by reading cookbooks, or learning cooking theory. You gotta put to practice what you learn or you forget.

No matter how many times you read about how to crack an egg properly until you do it over and over again, you wont get good. Until you combine that simple and singular action with all the other steps to create a more complex dish than an omlet, you probably will feel dumbstruck staring at your kitchen.

This is probably the same type of feeling you are having trying to build some of these projects.

So what to do then? I suggest building something small. Identify something you can try and try to build it within a time frame. Don’t know CSS? Then build a website without one. Don’t remember HTML, then use as little as possible to build one. Keep reducing until you either get to somewhere you already know, or are bored, then add in more “parts”.

Unlike cooking, experimenting and just trying to do stuff is relatively free, you don’t have to “eat” what you made, nor do you have to buy ingredients or even clean up after! So build, fail, learn and build again. Rinse and repeat and you will see progress even if its brute force repetition.

Good luck, keep learning, keep building and keep asking questions!

PS. I wouldn’t use AI unless you want to never think/learn about what your doing. If you just need something done then sure, but understand it doesn’t help you learn.

3

Welcome back to the forum @JerryTheQuad

It sounds like you were a programmer back in the day, building some amazing things.

HTML and CSS are not programming languages. But they are languages.

Treat them like you are learning a foreign language. Rewrite the code in your scripts until you become acquainted with them. HTML only has about 120 elements, and you won’t use most of them, just a few. As you grow your knowledge, use the code in different combinations to construct web pages.

CSS is tricker. Figure out what you want to do, then use it to style your page. You can use @media queries to make the page responsive.

JavaScript is a high-level programming language, so takes care of accessing memory locations for you.

Instead of going straight to the computer to start coding, write down what want to do.

  • break down the problem into small steps
  • write the code for what you are trying to achieve
  • deeply understand the problem you are trying to solve

For example, to center a div element with a form element and style it:

  • create a user form, center and style it
  • this information will be used to create a unique user account for a blogging site
  • save files containing boilerplate code for index.htm, styles.css, and script.js
  • create a div element in HTML: <div></div>
  • nest a form element inside the div element: <form></form>
  • add a fieldset element for the users name: <fieldset></fieldset>
  • add a fieldset element for the users age: <fieldset></fieldset>
  • add a fieldset element for the users email: <fieldset></fieldset>
  • add label elements for each fieldset element: <label for=""></label>
  • add input elements for each label element: <input id="" type="text" name="" required />

Once you’ve done the above, take a short break. Then tell yourself you are getting a reward. You get to style the elements you just created. It doesn’t matter if it doesn’t look good on the first go. You can tweak it until it is good enough. See if you can reuse code from past projects.

Have you heard about the Bad Website Club? Here is a link to their: Launch Party | Bad Website Club

It’s beginneer friendly, and they post their videos on their website so you don’t need to view them live.

You’ll need a way to relate what you are learning to your what you want to achieve. Sometimes the theory part will be boring, but you’ll get to use it later on. Build simple things after each lesson to help solidify the knowledge. Take time each week to review what you are learning. Also take regular breaks from the computer. I didn’t find many of the lectures exciting, but I did find using the knowledge I gained to build something unique quite exciting. Most of the practice projects I built no one, except myself, will ever get to see. But those practice projects helped give me confidence and motivation to post my actual projects online.

Happy coding