Jan 18, 2022 18:55:56
How to create a good code using the flow charts


My name is Andreas and I've been working as a software developer for 5 years (approximately 😁).

I'd like to discuss one tool that many developers neglect and that many new developers just don't guess about.

It's the flow chart and we use them to program our logic properly.

Helen Vovnich
Jan 03, 2022 23:45:58
Debug like a pro. 4. Save an element as a global variable

This piece of advice will be pretty short. But I believe it's very useful!

Did you know you can save an element as a global variable? Yes, you have tons of elements on your webpage and you can access them by name. Temporarily name like "temp5" but it's okay because you can rename it!

Let's start.

Sea Cat Wizard
Dec 24, 2021 00:29:05
JavaScript. Full program

This program is divided into 3 parts (levels) because we decided it has more sense than just slumping all the topics together (you can find all the topics in one list at the end of the program). This division is based on our personal experience and doesn't pretend to be the ultimate truth.

JavaScript: Basic level
  1. The JavaScript code structure. Statements. Using semicolons and quotes. Comments.
  2. Declarations. Variables: var and let. Allowed variable names and naming conventions. Constants....
Sea Cat Wizard
Dec 21, 2021 17:03:18
How to choose a programming language to learn

I see people around me (I'm working as a remote code mentor so "around" is used rather literally but anyway 😁) ask this question over and over again "Which language should I learn? How to prefer one language over another one? What if I'm wrong?" 

So after hearing this question approximately 1,000, 500 times I decided to write some manual that visuall helps you to decide which language to prefer. 

But first, let me answer the question "What if I'm wrong and chose a language that is not right for me?" My answer is pretty simple: "Even if so, nothing bad happens." Why? Because every time when you learn some programming language, it gives you the global programming experience and every next language or framework will be easier to learn. When I started my programming journey one of my first programming languages was a Visual Basic I used for the "visual database system" by Microsoft called Access. Do I use it now? Nope. Was it helpful? Very much! Because learning it gave me:

Helen Vovnich
Dec 16, 2021 04:54:25
Debug like a pro. 3. Breakpoints

If you are a beginner web developer, you probably know that browsers have so-called developer tools that allow extensive debugging of any code (running in the browser itself). The breakpoints are one such feature that can be just a lifesaver (well, maybe not a lifesaver, but a timesaver, for sure!).

How to set the breakpoint

Open the dev tools (F12), then click the Sources tab, and on the left open the file you want to debug

Sea Cat Wizard
Dec 14, 2021 18:24:21
CSS3. Full program

This program covers all the topics you need to know to use CSS and CSS3 professionally.

Topics that are not covered: HTML, JavaScript.

  1. What are styles and why use them. CSS syntax. Applying CSS to HTML: DOM. Using CSS: via external files, internal and inline CSS. Errors in CSS and unknown rules. CSS specifications. Comments in CSS. 
  2. Browsers support. Using the browsers' debugging tools for exploring and debugging CSS.
  3. Selectors: by tag, class, id, type, attribute. Grouping selectors. Combining selectors: nested, child, siblings....
Sea Cat Wizard
Dec 13, 2021 18:46:38
HTML5. Full program

This program covers everything you have to know about HTML(5).

Topics that are not covered: JavaScript, CSS.

  1. Introduction to the Internet and HTML. HTTP and other protocols. Methods.
  2. Tags. Tag values and attributes. Closing tags. Valid and non-valid HTML code. How browsers work.
  3. Documents HTML. Doctype. Head and Body. Comments
  4. Paragraphs and blocks. Line breaks. Horizontal line. Preformatted text.
  5. Semantic blocks. Header and footer. Section, article, aside, nav. Summary and details.
  6. Accessibility and aria. Responsiveness, media queries.
  7. View elements: progress and meter.
  8. Text formatting: blockquote, code. Text styling, fonts, and font styling.
  9. Internet images: modern formats. Inserting images, using images and text together. Canvas. Scalable vector graphics (SVG).
  10. Hypertext. Links, absolute and relative links. Inner links. Inserting other documents (link tag). Script tag. Links to email. Target attribute.
  11. Lists: unordered and ordered lists. Nested lists. Description lists.
  12. Tables. Rows and columns. Table header, body, and footer. Merging cells vertically and horizontally. Formatting tables. Table errors. Using tables for content formatting.
  13. Forms. Form elements. Textarea. Select. Buttons (submit and reset). Formatting forms using tables, lists. Label.
  14. Forms (continued).  Input: text, number, email, password, range, date, checkbox, radio button, file, color. Autofocus. Sending data. Placeholder.
  15. Forms(continued). Validation. Required fields. Pattern. Custom error messages. Restrict possible values and length of text.
  16. Video and audio: codecs and containers. Video and audio tags.
  17. Frames. Frame containers. Frameset rows and columns. Formatting frames.
  18. Image maps. Polygonal, rounded, and point areas.
Helen Vovnich
Dec 09, 2021 17:25:28
Debug like a pro. 2. Method of exclusion

Today we discuss this simple but very effective method that you can use when you are stuck with something and don't know the source of the problem.

Imagine: you wrote a big chunk of code without verifying it works. I never recommend doing that, instead, I would always move on doing really small steps.

But anyway, something is broken in your code and you don't know what it is.

The point of this method is you comment on all your new code to return it to the previous state when it's working. 

Helen Vovnich
Dec 07, 2021 17:02:00
Debug like a pro. 1. Stupid but so useful print

Hello everyone,

I decided to write a series of short posts revealing the dirty truth about how professional software developers debug the code that you could do it to!

We will review how to:

  • find the source of a problem
  • identify its nature
  • fix it!...
Sea Cat Wizard
Dec 05, 2021 00:02:36
What is CodingWolves about and how to use it effectively?

Hello everyone,

let us make a short introduction to CodingWolves.

What is it about?

CW is a platform where you can learn to code in an effective, interesting, and fun way. We believe the method we created will give the best and fastest results. We call it PIF, "Practice, Interaction, Feedback".

Sea Cat Wizard
Dec 03, 2021 19:27:54
How it works

In this article, we consider the general approach to take practice in coding and how we organized the process on the CodingWolves.

Sea Cat Wizard
Nov 30, 2021 20:13:38
Book Review
JavaScript Patterns: Build Better Applications with Coding and Design Patterns by Stoyan Stefanov - your way to be a JavaScript pro

If you want to change your JavaScript skills drastically, I highly recommend this book. The name may be a bit confusing: someone can think about usual design patterns (well, those, you know from the "gang of 4" like factory or decorator) but actually, it's rather about the patterns you can face in JS to wide extent: consider a pattern as a piece of code, or approach that can be reused again and again (and it's good) and an anti-pattern is an approach that it's better to avoid (you will find the classical design patterns here too).

Stefan starts with the basics of JavaScript and then dives deeper and deeper that at some point you start forgetting it's just about a "simple" programming language that runs in a browser!

Helen Vovnich
Nov 26, 2021 22:35:33
A small hack to see a DOM object in Chrome

If you are a web developer, you look at the DOM objects pretty often. To see them, we just right-click and then select the Inspect command, or we can do an old good console.log. But...

Sea Cat Wizard
Nov 25, 2021 21:32:16
What to do if you feel stupid, silly, and behind others, why it is good, and what to do (and what not to do)

Many years ago I went to University for the second time. I was 25 and I did math pretty well - but at the level of a high school. When Uni started I was in the hospital because I had an unexpected surgery. When I returned after several days of absence, I went to the first lecture (the first for me) and it was not so bad. I didn't understand everything but at least it looked a bit familiar.

The next day we had the practice - I thought the teacher would explain how to solve the problems related to the lectures. But, to my horror, it was an absolutely unknown topic. I didn't understand any word, any symbol, anything. I thought "What the hell, this is not for me, because I will be not able to figure it out!" I was scared because I also thought that this topic had nothing to do with the lectures. I still don't know why the teacher chose to practice the topic we even didn't start but it never happened with other topics.

Nov 06, 2021 09:25:57
A small hack to build your professional profile

Let me share my small hack I started using recently.

When I started learning to program I asked many questions, I even had to register on Stackoverflow. But now, 2 years ago, I don't want my employers (especially the potential ones) to know the stupid questions I even asked.

So, I created another account and only answer there. Now it has more 1,000 points. And even my first acc has almost 5,000 points I would prefer to share my second account that has much bigger impact and looks more solid.

I hope, it helps somebody.