Programming as a beginner is bittersweet.
You get to fail fast and still be enthusiastic enough to keep on learning programming. And the joy of actually seeing your work up and running is awesome.
At DOvelopers we mostly work with individuals and facilitate interactions. So for me this exciting, as I get to understand different points of views and be in the shoes of different roles.
In my previous post, I wrote about how I worked with Adobe XD to design a prototype of an point of sale system. Next step was to sketch things out in html / css for a static perspective. And afterwards to add some dynamic functionality to the screen.
So I setup my GitHub account and learned the mantra ‘add- commit – push’. I downloaded Visual Studio Code and added the index files in css and html and starting fleshing the POS as in the initial prototype.
I created the html structure and added some styling with css. After some research, I choose to use Grids. I find grids easier to structure layouts.
In the meantime, I did some mistakes.
Uploaded stuff on the Github branch directly and learned the power of git stash. Now this caused quite the panic, I am laughing now, but I wasn’t back then. I also formatted my code sloppy, misplaced commas and semicolons everywhere, invented word, etc.
The result, after several iterations, was close but not quite to the initial design. After adding additional grids it felt too much, so I begin to change the initial design and redo the code a lot. The last version is different and I managed to add functionality on it, will follow-up with a demo in my next post.
Progress through learning
As for HTML, this was very useful for me, cheat sheets are great: https://htmlcheatsheet.com/. And I also found a cool online course to learn about css grids where you can practice in real time the tutorials: https://scrimba.com/g/gR8PTE .
I also started to be afraid of not programming properly and adding useless code. Programming is also about continuously cleaning up your code. That is why I choose Bootstrap for example. I was adding so much CSS that was not doing what I imagined. And Bootstrap solved that issue.
I figured out that I was missing the most and blocking my progress was the lack of vocabulary and the abstract thinking. Also, the theoretical part is important in learning how to code and talking / writing what you plan to code is essential.