Effective online learning programming with Code Avengers

In search of high-quality online services for the study of programming, design and game development, I found several services that are distinguished by the quality of the material, and I decided to write an article about one of them and share my experience with you.
Today we will talk about ode Avengers | https://www.codeavengers.com

Main criterion

I think most will agree that the most important criterion for a good learning site is only one indicator - the desire to return to the site and continue learning.
Codeavengers is one of the few such sites that made me love learning programming and web development.

| Design and functionality

Nice simple website design with a visual structure of courses.

Convenient and functional design of the courses themselves

- Multiline editing (ctrl + click):

- Ability to instantly continue where you left off (last time) (written code is saved)
- Visual demo of errors in the code
- The pages of the lessons themselves are divided into 3 areas:
Explanations and step by step instructions | Enter the code | Result code

')

Clear explanation of all new terms

- When you click on a new term, a pop-up menu appears with an explanation. For example, below is an explanation of the term “refactoring”:

- If you don’t have enough explanation for any function, then when you click on this unfamiliar function (in this example, print ), an interactive menu will appear with additional examples and the result of executing the code of these examples
In the same place, from the list, you can select any other function and also see its explanation with examples:

The progress display page for completed courses

- On the progress page, the lessons learned (on the left) and the tasks (on the right) are displayed, which can be followed after (before / during) the course to repeat the course
- Lessons highlighted in pale blue indicate that an error was made in the lesson (errors are shown and explained in a visual form immediately when you click Run, after writing the code):

| Efficiency

Effective demonstration of what exactly you need to do "so", and not otherwise.

For example, when a task explains why you should not use hard-coding (using manually injected values ​​instead of variables), this is not just explained, but also shown with an example (something that almost all other similar services lack so much), and this is done as follows in the following way:
- At first, in the first task, you are told to zakardkodit several parameters
- After that, they say to fix several parameters in the code manually to different values ​​(as in real life, changes often occur, for example, a change in the price of a product)
- Then show the method that should have been used instead of hard-coding, so that you do not have to manually repeat one action after the other after the changes
- After that, you no longer need to explain why it should be done exactly “as” as is customary, because you were just shown with an example how much more convenient the “correct method” is, and why it is considered correct.

Simple but ingenious. In my opinion, understanding why we are doing what we are doing in the code, and why it is precisely “so”, and not otherwise very important for memorizing and understanding the very essence of the actions. Therefore, out of all programming learning services, in my experience / opinion, Code Avengers is the best at the moment.

| Additional Information

- On a free account you can learn the first 5 lessons of each course.
- Some courses are available in Russian (currently translated HTML / CSS / JavaScript / Game Dev / Intro to Coding)
PS
A little advice on experience - if your level of English is intermediate or higher - learn everything you can in English, including programming, so that in the process of learning you can simultaneously improve your knowledge of English (grammar, vocabulary, real use of words in English) . For an instant translation of a word / phrase, you can use the Lingualeo extension ( Chrome / Firefox ), which allows you to translate a word / phrase by double-clicking

ode Avengers | https://www.codeavengers.com