I always talk about my experience, my first technical test when it comes to development, basically the interviewer told me: "Hey, I'm looking for a frontend developer*, you're a great frontend developer that fits the position with all the requirements, unfortunately, you don't know anything about backend but the basics, sorry".*

I was impacted by that interview because I applied to get a frontend-developer position, but I was supposed to know about the backend and how to configure a server.

Most of the companies, in reality, require a full stack developer, however, they just mention one stack (frontend or backend) because that's the focused workload the developer would have if they get the position.

A lot of beginner courses for web development just focus on frontend development to land your first job, because it's "easier", but you need to be aware of the full stack and how it works, and how to build your full-stack web application.

I didn't know that, I was confident that by just knowing React, I'd get the job. Don't get me wrong, maybe some companies wouldn't care about you know the backend stack, but your resume can stand out if you know it.

During this year (my last post was on Sept 21), I focused on backend development, and thanks to that, I got my first job as a Business Analyst for a big company, which in essence is not a backend-developer position, but it helped me build strong concepts about the backend and how it works and hopefully I can get that job I missed in that interview for 2023.

So, what's the guide?

I consider that the front-end development roadmap is straightforward. You make dynamic websites with nice features and with the help of a framework, you can organize your code, following best practices. You just need to get a grasp on HTML, CSS, and JavaScript and you're all set.

Of course, there are other concepts to know about, but those are the most important tools you need to learn if you want to be a front-end developer (plus a good framework such as Vue, Angular, or React).

However, when it comes to backend development, I found it confusing, because there are so many ways to become one, several programming languages, etc.

I have a proposal on where to start and how you can prepare for your next role as a back-end developer.

Frontend advanced concepts

Before preparing with the backend topics, prepare yourself on more advanced front-end concepts related to the back-end.

• Fetch API - JSON: If you have worked in the front end, you should be familiar with this concept, as all the data you display in your web application, comes with this format.

• Promises - Async / Await: JavaScript is a single-threaded programming language (at least in the browser), just one task at a time, but it works based on promises, asynchronous tasks are something that you will deal with.

• HTTP Methods: Either by using a form or getting information from an external server, you need to communicate your app by using HTTP methods, the most common ones, GET, POST, PATCH, PUT, and DELETE.

• Backend as a service: Maybe you don't know how to create a server, but some services do that for you, Firebase and Supabase are good tools to give you an idea of how the backend works.

Databases

I'll give some topics and talk about general information that can be useful to learn. My proposal is in order, so I recommend you investigate the topics one by one as a roadmap. Databases are the first thing you should learn.

• Database normalization: A database is a system where you can store data, to do that, you use Database Management Systems (DBMS) like MySQL or SQL Server. However, you don't only store data as you want, there are some best practices and patterns you need to follow to have your database as optimized as possible, that's called normalization.

• Types of databases: There are two types of databases, relational and non-relational. Investigate their advantages and disadvantages.

  • Relational databases (SQL) have a fixed structure, imagine you have some Excel tables and you can join them by using a key, which is a field that's common between two tables such as an id. To learn this type of database, definitely you need to learn SQL, that's how you query and post data.

    Tools: MySQL, PostgreSQL, SQL Server.

  • Non-relational databases (NoSQL) are not fixed and don't follow a pattern, they are created to scale fast and be flexible. Most of them follow the concept of a document, which is similar to a record on a SQL database, the difference is that a record can have different fields. However, you always need to follow a schema as a best practice.

    Tools: MongoDB, Cassandra DB, Firestore

• ORM: This is nothing but your programming language communicating with your database, it's not required for you to learn how to make SQL or NoSQL queries, you only adapt a framework from the language to the database and that's it. It works by mapping the database elements into objects by using object-oriented programming.

  Tools: Hibernate, Sequelize, Nest, Mongoose, TypeORM.

APIs

Application Programming Interface, is basically how an application communicates with another one, you create certain endpoints that your application will use to display data (this is the core job of a backend developer).

You should be familiar with this when it comes to consuming APIs on your backend application, but a backend developer builds these endpoints for the frontend developer to consume them.

• Backend programming language: In this case, there are no limits, the most popular ones are Java, C#, PHP, Python, Ruby, and of course JavaScript (NodeJS). I recommend the latter because you're familiar with JavaScript by building front-end applications, so the learning curve will be reduced by a 60% guarantee.

• Backend framework: To build web APIs, each programming language has a framework, Java has Spring, C# has .NET, PHP has Laravel, Python has Django, Ruby has Ruby on Rails, and NodeJS has ExpressJS.

• REST APIs: This is not a tool but a standard you need to follow, you can have the technical skills with the programming language you choose, however, this pattern is agnostic, you need to build your APIs by following some rules, such as naming, cacheability, request and response independence, scalability by using a versioning system.

• HTTP: I already mentioned it, but in this case, you need to have a deeper knowledge about it, HTTP contains a request and a response, and that information is handled via headers which are metadata that tell us how the communication is done, and the body, which is the data itself. There can be some variants to the response and request and it can be done by using parameters in the URI of the API. An HTTP response contains some codes that will communicate what happened with the requests, those codes are 1XX which means information, 2XX which means success, 3XX which means redirection, 4XX which means a bad request or client error, and 5XX which means a server error.

• Authentication: As a best practice, an API shouldn't be exposed anonymously to the public, you need to identify the users (clients) that call your APIs, you can do that by using different methods. API keys, OAuth, Single Sign-on by SAML protocol, JWT, etc.

Web Servers

All the above is executed in a computer, but not any computer, it has to be a supercomputer capable to host a lot of users of your application at the same time, and that's called a server.

• Unstructured data storage: You won't only handle data, you will handle files, such as documents, images, video, audio, etc. that are classified as unstructured data that can be queried as a blob file. The place where you have these files can be different from where your web application is hosted.

• Cloud computing and load balancing: You need a supercomputer, but having it in your house is something that you might now want to do, it's expensive and space-consuming. There are companies that will rent you a supercomputer for less money like AWS, Google Cloud, Azure, Heroku, Digital Ocean, etc. You create a virtual machine and install your application dependencies, then you create a public IP address, so people can access your application through the web. If your application is too big, you can use several supercomputers, and install a load balancer to distribute the traffic, so your application would never break (most of the time).

• Web servers per se: Okay, you have a supercomputer, but you need software to handle your users' requests and understand what to do with them. The most popular software web servers are Nginx and Apache. Once you turn on a server, your computer is ready to listen to any requests and redirect the user to the right resource.

• Containers: Sometimes creating a virtual machine in the cloud might not be a good option, because setting up a supercomputer sounds complicated, and indeed it is, however, if you just declare what are the components and dependencies that your application will use in a file, container services can do the hard work for you. The most common service is Docker.

• Microservices and orchestration: Depending on the architecture of your application (monolithic or microservices) you might use multiple containers. Modern software development recommends dividing your application into small chunks called microservices, which are intended to perform only one thing at a time. You integrate those microservices (using containers) and organize them to work as a whole. That's called orchestration. The most popular orchestration service is Kubernetes.

• CI/CD: Software is never final, if your application wants to live for a long time, you need to update it and adapt it to any changes in technology. Continuous integration and Continuous development are related to it, as to how to deploy any changes and updates in your application.

• Web security: HTTP requests and responses can handle sensitive data, so you might want to look for ways your application is secure, such as implementing password encryption, making vulnerability tests on your server, HTTP headers that apply content security policies, SSL and TLS protocols, etc.

As you can see the road to being a backend developer is long, every topic is extensive but with patience and handling the basics of every topic you can be considered a full-stack developer.

In the beginning, I just wanted to be a frontend developer, but when I started to learn about the backend, I changed my mind and I wanted to learn more about it because it's more extensive and it covers more learning areas. In the end, it's your decision but definitely knowing the backend, as I mentioned, can stand out your profile.

Ps. I haven't posted for a while, this year has been amazing, I've got a Business Analyst job, I passed the Associate Cloud Engineer certification, I graduated with a Bachelor of Business Administration, I passed a Lean Six Sigma Yellow Belt certification, wow, a lot of things, but I'm now back on track.

As per the above, I strongly recommend you Brad Traversy's course that's definitely amazing if you want to learn the backend using NodeJS and Express.

I'm studying for a Bachelor in Business Administration, a Frontend web development Bootcamp, I have a full-time job, teach English in my free time and I'm almost done with my startup (an online academy).

A lot of things to do and sometimes I feel frustrated about it, but there's always some time to take a pause and think about the things you're doing. I reject the burned-out mindset (maybe I'm just in the denial phase) but as I mentioned, we're humans, and we can't stand a lot of things at the same time.

You may feel the same way, having a lot of projects, either personal or part of your job, a lot of things to study, preparing for a job interview, or simply working for a promotion in your current job. Those things can stress you out, so I have some recommendations of what I did these four months, hopefully, it'll help you out.

1. Stop and drink a beer

It's difficult to recognize that you're burning out, but there are some clues when you're almost in the burned-out zone you can acknowledge. Make a pause, specifically to think about your current routine, and ask yourself some questions, such as: Am I getting a healthy rhythm? Is this thing that I'm doing too important to continue doing it? What are the benefits I get from this? Am I being dedicated to my job or just obsessed?

Maybe I was too extreme when talking about alcohol, if you don't drink, substitute it for something you like. Reading a book, go outside, jog, do exercise, whatever you like and you're in the mood to do it.

I realized that when you do something different or something that's not related to technology, you can free up your mind and evaluate the things you're doing. I drink beers (I don't drive when I do it, because I do it at home and you should do the same). I release some of my worries and relax because I work too hard to get things done, but working too hard is not healthy. There should be some time to relax and do different things.

You're not going to fail if you dedicate one, two, five hours, one day, one week, or a month if you do something different.

2. Organize your ideas

After you relax, organize your activities and all the things you want to accomplish at once before being burned out.

When we burn out, that means that we lose control over the things we're doing. Remember you're the owner of your destiny, so you control what are the things you need to do.

To achieve great task management skills, you need to think, plan and organize what you have to do. Organize tasks will relieve what you want to accomplish.

3. Avoid what's not important

We work too hard that we forget what's really important. Are you working too hard for a promotion? Is that really important? Did you know if you die, you're going to have a replacement in the company the next day?

Some things are not fair, but what really matters are the things you like in life. You Only Live Once (YOLO), so dedicating too much time to something that won't give you a completely satisfied soul is not worthy.

I'd recommend you to enjoy your lifestyle. I know achieving your goals and working for them are important, but if you're getting stressed out and you're almost in a burned-out state, maybe that won't make you happy after all. Take a break please, and evaluate if your hard work will be valuable in the future.

4. Search for help

In June 2021, in my 27 years old, was the first time I consulted with a psychologist, I didn't know I needed one, but that helped me out.

I don't recommend you to go to the psychologist right away, but sometimes, we need to express our feelings to somebody. Find a friend you trust and tell them the way you feel.

Burning out is not worthy when we live a short life, asking for help will allow us to free up those feelings and have an objective piece of advice.

If you feel like that, feel free to send me an email to me@david-salomon.com and I can help you out, at least by listening how you feel and giving my thoughts about it.

This is a big heads-up when it comes to working, studying, writing, etc. The first thing you need to take care of is your health, and that's why I've been off for a while, but ready with a lot of ideas and a fresh mind to tell you things that will help you out in your career (or the journey to becoming a developer).

This is the context

Scrolling down on Facebook I saw a post from a well-known tech company here in El Salvador, they are looking for trainees in React. The only requirement was to know object-oriented programming and intermediate English, which was easy, so I thought, why not apply?

I've been studying JavaScript and know the basics of React, I want to work as a frontend developer and then move forward to the project management role, and it was a great opportunity.

I filled out the form and sent my résumé, I got the link for my test and I was nervous, but I just did it, and you know what... I failed haha, I was shocked but at the same time I was expecting to fail it, but you know what, these are the lessons I learned.

1. Just do it!

I saw the post, I saved it and prepared my résumé at night to send all my information. I took action and I imagined the positive things that could happen if I got the position and did it.

To be honest, I didn't think about my knowledge, expertise, or the type of questions they would ask, I just thought about a great opportunity and I had to take advantage of it.

Sometimes we're just afraid of what's going to be for our future if we fail the test, even being prepared enough to pass it and get the position, our feeling may betray us, so just do it. Even though you fail, in the end, you will realize what are the things you're lacking on and improve them.

2. Don't let the theory aside

I know how to create a class in JavaScript, it's easy, I'll make a blog someday about it, make sure to put the constructor method and then you can use its properties by using the new keyword and that's it, that's object-oriented programming in Javascript.

Haha, definitely the paragraph above is not a good answer for object-oriented programming. I got technical questions focused on the real concepts of it. I heard about the SOLID principle but I've never analyzed it in depth.

I was also asked about the core concepts of programming, such as abstract classes, overloading functions, superclasses, design patterns, and provide the result of a function and every answer was time-limited, one or two minutes, depending on the question. When I was doing the test, I was freaked out.

I've been studying and focusing on the language and the library, but I haven't studied the basics of programming. It's not enough to write cool and clear functions you learned from your teacher or instructor, you need to know why that function works the way it is and why developers choose that way to do it.

3. Save the questions and create an action plan

My mind was running in circles since the first question, and I understood I was not prepared enough, so I took a screenshot of the questions to get the main idea and study more about it. At least I had to take the advantage of doing the test and gather the information I needed.

I created a quick action plan to follow through and be prepared once the opportunity is available again. Here is what I have:

• a) Identify the main idea or topic from the question
• b) Organize the questions by topic
• c) Research about the topic
• d) Solve the exercises and create three exercises more from the topic
• e) Test my knowledge back

When I didn't understand anything, that was a red flag, and after I imagined all the good things like a fairytale, I placed myself on Earth and I was realistic about my current knowledge level. That's when you need to think: What are the things I am lacking on and how can I overcome them?

4. Don't give up

A test is like a thermometer, you can measure your current temperature, and depending on the result, you need to take a cold shower or just take some pills, the same works with your technical test.

If I failed the test, but that doesn't mean I'm failing as a student, worker, or person. It's just a simple test, I will do it again until I cover what I missed.

An English teacher I had some time ago, told us, "Study and be prepared, the opportunity will come" and that's what I'm doing. Don't worry if you fail some tests while being a beginner, there are opportunities every day, everywhere.

I always talk about the importance of having the motivation to do things, blogging as a developer will bring some benefits to your career, I will mention the top five goals I always look forward to when blogging and maybe it'll give you some reasons why you should do it too.

1. Catharsis

Writing on your own blog gives you the freedom to express what you think in letters. Maybe you can't speak up on your house, on your job, on your college, but when writing on a blog you create your own space to open up your mind in a blog.

When I say what I want, I feel a freeman, so it's part of your personal development too. You always need to look for improving yourself, it's a necessity and the mind feels satisfied.

This motivation is too personal, and if you only have this as a goal when blogging, that's enough.

2. Personal branding

I like to have a good reputation, being known for my work, lifestyle, and way of thinking, so a blog talks a lot about yourself, it has pieces of your mindset that are built in this space. People can know you and make an image of what you are.

Personal branding is what you are and what you have to offer. Some other people will not feel comfortable with this, maybe they want to keep everything private so they become content consumers. Being a content consumer is definitely not bad, but building a personal brand is the opposite.

This is like companies having values, a landing page, a culture, etc. to keep or gain more customers. If you want to build a personal brand, this is specifically for followers, clients, or recruiters.

3. Build a community

Talking about followers, this is a good way of networking. Once you express your ideas and people recognize you as a brand, you will find people with the same interests as you.

I have some recommendations on that, you will need to be consistent when writing on a blog, it's weird to have a web development blog and create a post about cooking. You build a community with the same hobbies or career paths to identify you as an influencer in a specific field.

In your community, you can find interesting people, people that will support you (others will criticize your work but even that's good) having feedback on what you write, and share tools that will benefit everybody, etc. I'm really proud to be part of the Hashnode community, and I've found great people that always support me and I support them.

4. Help others (and also yourself)

When you blog you can speak about anything you want, however, there's an unspoken law that tells you that you need to be constructive on what you blog. A blog is not a newspaper where you can speak bullshit or yellow journalism. In the end, you write for people that are interested in what you think and people feel identified or benefited by your words.

Being a developer is a tool you can use in your favor to help others. There are a lot of technical concepts people find hard to understand. You can clarify what you've learned or what your experience has told you and assist others with your knowledge.

Sometimes, that works the other way around. At least in my case, I've written a couple of technical blog posts, but that's not because I master them, it's because I've been dealing with them for a long time and I want to organize my ideas by writing them on a blog. I understand those topics betters and people will either help you out on improving them or they will say thank you because they have struggled too.

5. Monetize

This is the motivation people look forward to the most. Catalin Pit has talked about how you can make money as a developer, even though those are good ideas (I'm planning to do some of them) maybe that's not my highest motivation.

People like money, I like it too, but it's not my priority number one, I have understood that there are things more important than money, but in the end, we need money to survive and have the life we deserve.

My two cents here are that, if I have a catharsis, I build a good personal brand, I have a great community and help others, money will come due to the previous steps.

A recruiter will read my blog and will find it interesting, maybe a client will know how passionate I am for my developer job or who knows, in my community I can find a partner to build the next startup.

Consistency is a must, and blogging is a way to prepare me, the opportunity will come.

WTF is a portfolio?

Simply, it's a place where you put all of your work. It's important to show what you have done to potential clients or employers.

This is not exclusive to developers, photographers must have a portfolio, designers, architects, engineers, models, and any other type of profession, everything that can be documented can be part of a portfolio.

In the programming world, portfolios are built with projects you have done or participated in. Frontend developers have it easy, they just have to show websites or web applications available online. Backend developers have it kind of difficult because their projects can't be easily shown on a website, however, they can have manuals and documentation on how an application they made works. (That's why it's important to know how to document your projects).

What should a portfolio contain?

A portfolio is a place where you put all of your work. Okay, but how and what. Do I have to put all the projects? Should I make it a website or a book? This is my opinion.

Before you ask, I don't have a portfolio yet, I'm working on it because I want to create on React, and I'm still learning it. The closest portfolio I have is my 50 projects in 50 days website, but with the information below, I'll tell why it's not a good site to make it a portfolio.

1. A basic intro about you

When a client or an employer visits your portfolio, it's like a date, the first impression counts (a lot), so you might want to make a good first impression.

This can be sum up as your name, your role, and a brief description (no more than 140 characters). Because it's what is going to introduce the person to continue reading the entire website (you can double-check with HR recruiters reading hundreds of resumes per day).

2. Your projects

Your projects are the main reason why a recruiter or client will visit your portfolio, so you need to have it organized. Some recommendations I can give you.

• Less is more

If you have 50 small projects like me, a person won't have time to check them all. Just place a few projects, the best ones, no more than five. In that way, you'll make your visitant focus on the best of you.

• Brief description of the project

Along with the project link, you should add a preview or thumbnail, the technology used in it, and the main use case for the app or website. For example, if you make a calculator with a currency converter, you'd like to describe the main function you worked on and the recruiter or client will review that specific function out of the entire project.

• Big projects are better

I have 50 projects that took me 1 or 2 hours, but those are things that don't add extra value if I'm applying for a senior dev role. On the other hand, if I have one big project that has taken me several hours but it does a lot of things, I'm showing that I can handle more than making small websites, I'm showing that I'm capable of maintaining a large project with many requirements.

If you have several mini-projects, I recommend you mix them up and create one instead, that's a valuable skill.

• Open source is great

Open source collaborations show that you can analyze others' code, get involved in large projects, collaborate without any monetary interest, and your skills are valued by others by integrating your code on their projects.

If you don't have any open source collab, that's okay, but it's recommended to try at least once and it will look great in your portfolio or resume.

3. Contact page

Of course, this is one of the things you need to have, you want people calling you to get a job or participate in projects.

Always have the easiest method to contact you, it's good to have your email and phone number on that page, by doing that, people will easily contact you. Having information public is good when you're building your personal brand.

You can have a dedicated phone number for clients or job stuff and a dedicated email like contact@domain.com or something like that, but if you don't want to do it, add a form with a few fields like name, email, and message to contact your clients back.

Show me what you have

Even though I haven't published my portfolio (I hope to get it done by the end of Q3) I always like to see people's portfolios. Edidiong Asikpo wrote a great article about portfolios to be inspired.

Do you have your portfolio ready? Do you want feedback from me? Please leave a comment, I'll be glad to see it.

My learning curve

So, I'm learning frontend development and I decided to deeply learn the React JS library to land my first job as a developer. I feel prepared with the intermediate knowledge in vanilla JavaScript so I'm starting learning React because it's in more demand on many of the companies I've been researching.

If you don't know React, basically it's a JavaScript library that allows you to write better JavaScript code dividing everything into components to make everything more interactive and well-performing.

You only need to create a component and you pass data into it, either from a database or from an API. A component could be a navbar, a card, a video, a task in a to-do list app, a blog title, etc.

CSS as a styling tool

I don't want to talk too much about React, but the way you can style components.

If you're still learning HTML, CSS, and JavaScript, you just create a file (or files depending on the size of your project) and everything is separate. In React there are some other options you can use to style components.

1. The classic way: A CSS file

This is the way everybody knows, you create your regular CSS file with your custom styles and apply a class name to your component.

Once the element is rendered into HTML, it'll have a class name and you just have everything in your CSS.

import './styles.css'

const App = () =>{
    return (
        <div className="excitingTitle">
            <h1>Hello World</h1>
        </div>
    )
}

As a note, since the keyword class is reserved in the JavaScript language, that's why in React we write className, React will convert it to the class attribute once it's rendered.

2. CSS with components: CSS Modules

Rather than having a large CSS file with all classes, we create multiple CSS files per component. So if you have a Navbar.js component, you need a Navbar.css file that contains all the styles just for that component.

In that way, you will follow the components philosophy in React and the advantage is that everything will be better organized.

import styles from './excitingTitle.module.css'

const App = () =>{
    return (
        <div className={styles.excitingTitle}>
            <h1>Hello World</h1>
        </div>
    )
}

The name convention is to add the word .module at the end of the title to distinguish it among other CSS files.

3. CSS within the JS component: Styled Components

This is an innovative way to style elements since developers can create their custom CSS within the same React components.

You use it with libraries such as Aphrodite, JSS, Styletron, Emotion, and other ones, but the one I learned and applied it on a project is Styled Components.

Check my last small project, a calculator created in React on https://calculator-davidsalomondev.vercel.app/ and the source code is on https://github.com/DavidSalomonDev/calculator

Style components is a library that allows you to create CSS code as functions, using the benefits of inheritance from Sass and passing props to some property values.

import styled from 'styled-components'

const StyledTitle = style.div`
    background-color: #333;
    color: #eee;
    margin: 2rem;

    h1{
        font-family: 'Open Sans', sans-serif
        font-size: 4rem;
    }
`;

const App = () =>{
    <StyledDiv >
        <h1>Hello World</h1>
    </StyledTitle>
}

It's commonly used and you can identify what are the styles a component has.

4. A simple CSS library: Bootstrap or Tailwind

I didn't know that this way was the most used among React developers, and it was disappointing for me. I'm a person that likes to modify and have control of everything and know what's the origin of things.

Using a CSS library is reusing what another person already styled. It takes off a little bit of the originality your project should have, but the developers' opinion is this: Why are you going to complicate things that are already created?

That's a good point if you are going to work on small projects. So, simply, to style using this method, you only need to import the library and apply the classes stated in their documentation.

const App = () =>{
    return (
        <div className="mt-4 pt-2">
            <h1 className="text-5xl text-blue-700">Hello World</h1>
        </div>
    )
}

If you're not good at design and styling, I think you can use this method, or sometimes even though you are good at it, there's no time to create custom styles to deploy an application (overall in startups that need everything for yesterday).

Tell me, what's your favorite one?

• Are you the one that likes to style everything?
• Do you use CSS libraries?
• Do you create separate components or is it everything in just one file?
• In your opinion, Is there another framework or library better than React?

Tell me in the comments, I'd like to read at your thoughts and learn from them.

If you have followed me during this journey, I'm still learning Web Development (specifically Front End development). I work for an IT company as a Tech Support specialist but I want to move to a web development career.

I started my journey (like many others) by watching online courses during the pandemic and followed the instructor along with the code. Nowadays, people can learn how to code (even for free) and there's no excuse to do it.

While studying, I found out people recommending books and my first impression was that books are an old way to learn technology. Technology should be taught by just using technology and let other majors authors (accounting, law, or psychology) write their books.

Just to reinforce my assumption, I had to read a programming book to confirm or deny my statement and I realized what a wrong mindset I had!

🤔 Is it worthy?

In the 2020 Stack Overflow Developer Survey almost 85% of the respondents feel that formal education is somewhat important.

I discussed that with an English mentee I have (that's a current software engineer at a startup, he has a degree and he told me about the things that an online course will not teach you in-depth, such as analytical thinking by using algorithms, programming paradigms, design patterns, SOLID principles in object-oriented design, etc.

Online courses or online information will show you the programming language syntax, create a couple of projects (and even stick to the instructor's style to write code) but they won't give you the necessary tools to create things by yourself using your own criteria according to well-proof best practices.

That's the type of knowledge you need to back up what you're learning, and if you're not studying at college or having a formal education, you will find those topics in books. Because in the end, that's what colleges do, they teach the content of books in class but in a well-synthesized way.

📚 The book style

Some people don't like to read books, because they have a lot of information, (sometimes it's redundant) and there are a lot of books outside to read or they just want to learn at a fast pace.

In some way, that statement is true, but that doesn't mean you have to look at books as a slow way to learn, in fact, if you try to learn fast by just watching courses and reading spread information online, you will lack on the basics and maybe in the future you will need them to be part of a big project and you will need to re-read or to go back to the basics and understand a way to do things.

The way that most of the books are structured is this one:

• Introduction
• Background or required knowledge to study the core concepts of the topic
• Basic information to main features
• Advanced information
• Sample code or Exercises
• References

What I want you to notice is the path you follow with books, you go from scratch to know in-depth knowledge about the topic, and new concepts are not included until they're covered in the previous chapter.

Knowledge in books is well-organized and you can check how other fields are interconnected with the subject you're reading to create a more systematic way to study.

🕶️ The way you should use books

When you study at college, you have to read books, no matter what career are you studying, there are books for everyone and that's an old used method but still effective these days.

Reading books is a good way to get knowledge, but not because you're reading a book, that'll make you smarter. Programming books are not like science fiction or romantic stories you read, you need to create a system or follow a method to get the most out of them. I have some suggestions you can take into consideration while reading programming books.

1. Understand the why

I always mention the importance to have motivation, so if it's a book that you're reading just because an influencer mentioned it and you, after my blog post, you don't want to read books, simply don't do it. You know yourself better than anyone, and you know what's the best way to learn for you.

Also, if you're going to read a book, please be aware of the value that it'll bring you. The way you can take advantage of the knowledge and how it can be beneficial for you. It'll keep you motivated and know that your gaining knowledge to apply it in the future.

2. Read the content topics and instructions

Programming books have a special way to read them, not all of them are the same. Some of them will require you to complete some exercises before moving to the next chapter, others will share with you the code used in the book for you to replicate it.

You can verify if the knowledge is worthy for you by taking a look at the table of contents, if you notice that more than 75% of the topics are already handled by you, maybe you would like to buy a more advanced book. (It's not harmful to read a different book with basic knowledge though, there's always something new to learn, but it'll depend on the amount of time you want to dedicate)

3. Take notes and follow along

Our mind works in two modes (some will disagree, but that works for me):

• Input: You receive information in two ways (reading or listening). You read the book and gain knowledge, but in a learning process, that's not enough, after you have received the information, you need to switch mode.

• Output: You put into practice what you learn (by writing or speaking). In the programming use case, this is done by writing code. Do the exercises, code along with the book, and ask questions to peers or mentors. Output is the knowledge test for excellence. You will confirm whether you are learning with the book or not.

4. Compare it with other books

In the end, a book is just a set of knowledge provided by one person or more people, so to create your own judgment, you need to read other books and get what you think is good for you.

Commonly, authors will have the same opinions on how to do things, but when it comes to the basics and core features of the topic, they will agree because that's the way things are created.

For example, it's impossible that in JavaScript, an author states that the way you create a variable is by using the keyword word (we use either var, let, or const) because it's something already stated.

If you're reading another book about the same topic, you can skip the basics and jump over best practices and recommendations. You can confirm that by reading the table of contents.

✅ Book recommendations

I wouldn't finish this post without recommending some books I've read. I won't give my opinion (and also I won't share any referral link) but I'll give you some insight into whether it is a good book for you.

• Think Like a Programmer: An Introduction to Creative Problem Solving

Some beginners focus on the syntax of the language and how the instructor does things, but have you ever thought of solving a problem by yourself? That's what the book focuses on.

It uses C++ to write code, however, the programming core concepts are established in this book that can be applied to any other programming language. If you can handle this mindset, the language syntax won't be a problem.

• Eloquent JavaScript 3rd Edition: A Modern Introduction to Programming

The logic in programming is important, but as well as the syntax if you are learning a specific language, Eloquent JavaScript includes all the details you need to know to master JavaScript.

I recommend you to read just the third edition, as it includes the ES6 syntax and methods, and the best part... It's free online.

• Learning React, 2nd Edition

I'm learning React and if you're doing it as well, this is a good book. It doesn't only talk about how React works, it'll give you an insight into how functional programming works and how it's used in React.

If you're not interested in React, what I want you to take from this is the editorial O'Reilly Media. They have a lot of books about technology and programming such as the famous series "Head First" that are friendly guided to any technology.

• Clean Code: A Handbook of Agile Software Craftsmanship

This is the book that every developer should read, it's not language-focused, but it talks about the way you write code. We can say they're principles to follow to make your code more understandable, reducing headaches and increasing the opportunities to optimize what you do.

Uncle Bob has other books about best practices and how to work with the stuff that's around a software developer role.

Before I started all this journey in learning web development, I was passionate to write and teaching people about the things I've learned (and still, this blog is the proof).

I work on a big company that has created several applications, and customers use them as a service (SaaS) and I work providing technical support to customers, filling out bugs, reporting issues, or guiding customers to configure their service as their use case.

In that type of job, you can find smart team members who, that as side projects, they create small applications, services, or browser extensions to make our work easier. Some of my team members have created smart scripts to automatically send emails, a case comment generator, or a tool with KPIs and metrics but to deploy those tools to our colleagues in the company, they needed to create a user guide, and they struggle with it.

Discussing that with a Sr. engineer, he told me that developers don't like to document, it's tedious and that was an interesting fact I knew about developers. Do you feel identified with that?

🤷 Why is it important?

I didn't understand why my colleagues wanted help documenting their tools. I imagine that they think it's a waste of time because tools are intuitive enough to work with and it's not necessary.

Or maybe it's because they can focus more on coding rather than explaining simple steps to users. However, we don't know how other people will react to your app or if there's an area of opportunity you need to fill out.

✅ Clarify the right use of your app

Some users will try to identify a use case for your app and what's the best context to use for. You, as the creator of the app, are the one that knows the answer, you know what's the need that your app will fill out.

Explaining a good motivation in the documentation is always good to align users with your goal, so they'll get the most out of your app.

✅ Show all the features

Depending on your app features, some of them will not be needed for your users. For example, if the main feature of the app is to create automated tasks and schedule them in a calendar, your users will know that it's the only way to use the app. But what about if you also have features like sending an email after creating the task, sharing the task to colleagues, adding profile information, getting a completion report, etc.

Documenting is the opportunity to show how the app can be used and all the features that can be used with it.

✅ Gives you exposure

If you want to sell the app or gain more users, you can use the documentation as a selling point, documentation is the way your prospects or potential users will know what's the app for.

If the app requires membership or an authorized login, you can add the documentation to your portfolio, so users will check if that's the app they need.

You may argue that you only need a good landing page to show up everything, but believe me, some people (like me) like to read all the documentation, pricing, detailed features to confirm if that's a good app to sign up for or not.

✅ Your app will be taken seriously (what about if you scale?)

Most famous apps have documentation because they want users to be fully aware of features and the right use of the app.

Imagine you buy a brand new TV and it doesn't have a manual guide. Everything seems intuitive, then you encounter that if you want to configure additional apps, you need to add a default password provided by the manufacturer and you don't have it.

Those details get users angry and they have to spend time with tech support to solve that issue, something that can be solved by having clear documentation.

It's also important that if you scale, and if you have good documentation, tracking all your features and steps to configure the service will be easier at the end.

✅ Maybe the app is not too intuitive as you think

You, as the app developer, know all the features and how to go to every step, and I think if that's an app that you only going to use yourself, you don't need documentation, however, if it's an app you will share to other people, they can provide you feedback.

We work as our mind is built, and it's not the same way as other people's mind is built. So you can explain the features as you think they need to be used.

🤔 How?

Documentation is important, fill out your motivations there, now how can we do it?

🧙 Know your audience to choose the right words

It's not the same to build an app for developers, executives, or end-users. It will depend on the people who will be using the app. If you use complex terms for users that don't know anything about web development or app deployment will be counterproductive.

The same as if you build an app for developers, creating documentation explaining what are HTML tags, will be overwhelming as the documentation will have a lot of unnecessary information that every developer should know.

Empathy is put yourself in other's shoes, so, you will need to answer the question: How can I use this app with the knowledge I have? or What's the best way I'd like to have this information presented?

After you understand what's the knowledge of your target audience, you need to start writing the instructions and describing features in the same jargon as they want to be interested in reading.

⌨️ Organize the project features

It's important and useful that while you're creating the app, you're documenting. As per my conversation with my friend, I know that's not the case most of the time and then you need to document everything after the app is done and you don't know where to start.

This is a basic outline I follow when I'm documenting, you can follow it as you need it:

1. App description or overview: Describes what's the app for and the best use cases.

2. Objective or motivation: Tells your users your motivation to create the app and the issue you are trying to solve.

3. Release notes or version updates: As the app scales, you can keep a control versioning system, it also applies to your documentation as you're adding new features or solving bugs.

4. Features or user stories: This is the core part of your documentation. As a suggestion, describe every user story. If there are user stories that show in other pages within your app, describe them first and then describe the unique ones.

The first feature you will describe is the first feature the user sees as they open the app and so on. Describe every detail from top to bottom and from left to right.

5. Troubleshooting and support: Some people will encounter issues while using the app, maybe it's part of a known issue and you know how to solve it, you can add some troubleshooting steps or just add a way to contact you (the most common one is to fill out a form with an issue description.

6. Feedback: If you want to improve, please this section is very important, ask for feedback or feature ideas/

🕶️ Images are good but not too much

I use images in my documentation, however, having a lot of images can be overwhelming.

You can use just a screenshot for big sections, or user stories. Features that show on every page or part of your app can also be useful to include in the documentation as images.

Remember that if you are documenting, the user will go directly to the app and they don't need to watch the same image in the documentation. Focus on the images that you think the user will have difficulties finding out where they're located.

🔧 Tools to document

Here are some ideas you can get on the tools you need to document better.

✅ Google Technical Writing courses

I strongly recommend you continue training on your documenting skills. In those courses, there are some details you'd like to take into consideration such as grammar or audience.

It also gives you an idea of how to organize the topics in the documentation.

✅ Google Docs or MS Word

If you are with the KISS mentality (Keep It Simple Stupid). You can document using Google Docs or MS Word and share the document with your team or end-users.

In the end, remember that you need to provide a clear description of your app, and the tool you use, might not matter for that.

✅ Notion or Evernote

If you want to take the next step in in-app documentation, you can use these tools like Notion or Evernote, they're specialized in note-taking and it's easy to organize topics and features.

You can also tag or classify the topics and they have a nice style to present to end-users.

✅ Documentation packaged app

If you want to continue being simple, you can create a README file using markdown, that's a good alternative if you use a web app. Or my recommendation is to use a documentation packaged app.

I shared an article for you to choose the best documentation app, my favorite ones are Docusaurus or GitBook.

✅ Look for a specialist

If it's not mandatory at work and if you don't want to document because it's boring. Look for a specialist, someone that likes to do it and do it great. I added my email me@davidsalomon.dev if you want to contact me and I can double-check your project and provide you ideas on documentation or if you want me to help me documenting your project.

However, if you don't want to go that way, you can go to platforms like Fiverr and hire the services of a technical writer.

You prepare yourself for technical skills, you practice every day the programming language you prefer to get a job in the future, or maybe have a freelance job, or what about having a promotion if you get that certification that's very demanding in the company you work for. Those technical skills are called hard skills due to the knowledge you need to have to perform a specific task.

Most of us want to specialize in some areas of knowledge, if you're reading this blog, it's for sure you're interested in technology and you know that there are a lot of fields in which you can specialize.

The way we measure technical skills is by having a certification issued by a well-known company or institution, a score you have in a test or exam at college, or your performance at work that is known as a metric or KPI.

😳 Non-technical skills (?)

It's easy to define what skills are in terms of benefits, their measurability, their specificity, and how companies can give you a credential or certification that'll work as an exposure of your performance, however, there's a different type of skill that's quite complicated to define.

These are non-technical skills, in a nutshell, they are abilities that help us to relate with other people.

We call those skills: Soft skills because it's the opposite of hard skills, some others call them People skills because that's the only field where you are going to use them by building positive relationships.

📕 Characteristics

In most of my blog posts, I talk about knowledge and practice in JavaScript or technology in general, but now, I want to focus on these types of skills to deeply understand their use case and apply that to our career.

So, it's important to define their characteristics to differentiate them out of technical skills.

✅ Applicable in any field

When you have a technical skill (and I will use programming as an example from now on) you can only use that skill in the companies that require it. If you apply as a chef in a big restaurant, of course, you're not gonna code, you won't even use a computer there or the other way around, maybe a chef won't know how to use a computer if he's hired by Google as a software engineer. That's incompatible.

However, when it comes to soft skills, you can apply them to a big restaurant (I say restaurant because I used to work as a cook some time ago) and also at Google, for example, I can mention leadership. If you cook in the restaurant, that doesn't limit you to build a team and create a new dish or guide them on how to prepare 200 dishes in 1 hour for an event.

The same applies if I work at Google, leadership will be useful if you need to deploy certain features, but there are some insights you need to take from before doing it. In that case, you build a team, gather feedback and start working on the deployment of the feature or project.

Even though it's a different context, the leadership skills are valid and you can apply the building-team task in any place you go (or work and I will focus on the work environment when talking about soft skills).

✅ Non-measurable

I work in a company where everything is measured, they call it KPIs (Key Performance Indicators) and they are specifically for hard skills. I have a KPI called CSAT (Customer Satisfaction), which consists that customers who will score my work and their satisfaction with a score. I have to get more than 8 out of 10 as a score to pass that KPI.

Most of the big companies do that, small businesses may not measure that KPI, but they have other ones like sales or revenue, which is critical for the life of the business.

On the other hand, soft skills are very difficult to measure because they define the quality of the behavior, it would be ridiculous to say in a job interview: "Hey, I'm scored with 9 out 10 as a leader". What are the facts? Was there any secret test you took? Did you go to college to learn leadership?

At the same time, (and you may see it as a disadvantage), since they can't be measured, that's why they're difficult to develop. Schools or colleges don't teach you these skills. You can go to a leadership seminar, but it won't make you a leader overnight.

Even expert leaders have difficulties applying these skills because that's not something you study for, you learn these skills by having experience, putting yourself into practice, and making mistakes.

✅ Identifiable in a context

I mentioned above soft skills can't be measured, however, you can notice if people apply those skills into their lives. You can distinguish who is acting as a leader and who is a follower.

This is like observing a person and do a checklist with closed questions (Yes/No answers) for the selected skill:

• Does this person guide others?
• Does this person create and take initiative?
• Does this person have followers?

I mean, those are subjective questions people will do, some people will agree with the answers and some people won't, but you can have a framework of what that skill means.

Another problem with this is that if you want to people perceive this skill on you, you have to show up with your decisions and actions. The way you work is how people will notice what are the soft skills you have and that involves your reputation.

✅ One objective: Deal with people's feelings

In the characteristics above I constantly mention the words "people" or "others", because that's what soft skills all about. We're socials, we need to interact with others, however, the way we do it, will change their perspective they have from us.

This is not restrictive to a positive perspective but a negative too and I can assure that the lack of soft skills will affect negatively other's people perception. Of course, it could be in a different amount, with a big or small impact, but definitely, it will be negative.

If you are going to comply with any of the soft skills, it's to serve other people in a better way and these skills have implicit that there's gonna be another person or other people interacting with you.

👥 What's in it for other people?

Since the main objective is to deal with people's feelings, people will benefit from a personality with soft skills, let's check some of the benefits.

✔️ Good environment

People are gonna be comfortable with you, because you know how to handle their feelings and personalities, and everybody will look for you for any task.

Believe me, in a workstation where you have to interact with a lot of people, soft skills are on-demand, nobody can't stand someone with a bad attitude when working.

✔️ Efficiency

As there are no obstacles to deal with you, people will feel that you are a diligent person, and it will be easier to have you in their team to work.

I think that's the reason why companies are looking for people with soft skills, as the good environment is an opportunity to work well, it makes any backlog lighter as the cooperation among departments is evident.

✔️ Reduce stress

Having a bad work environment and inefficiency in processes or workload could make people stressed because there's unnecessary pressure from the overload. That's bad if you want to take care of your health and it will pay in the long term. So that's why it's important to have people managing soft skills.

🙋 What's in it for me?

Soft skills could mean an altruist term in which you give everything for everybody and nothing is for you, but I take a look at soft skills as a benefit for myself, and I think it's bigger than the benefit you deliver to others. I'll mention the most important benefits you can get from soft skills.

☑️ Mental health

This is the most important benefit I think because your health is what you need if you want to continue living, mental health is important. My experience interacting with people with bad soft skills is awful. They are unhappy people, they want to do things on their way, and once they're not approved they feel depressed.

Having good soft skills is related to optimism and happiness, and it's proven it'll affect your health.

☑️ Productivity

Productivity is doing less and achieving more. If you have a project in which you need to involve more people, the way you interact with them will help you get things done.

As I mentioned a couple of paragraphs above, there's an efficiency mindset, and people will acknowledge it.

☑️ Faster results and opportunities

Not only you're gonna get things done, but you're also going to get the results faster because there's this harmony effect that will make you achieve things easier. Imagine a group where communication is bad, nobody wants to talk to anyone, and projects get delayed because of a colleague not wanting to cooperate.

Also, as long as you have strong soft skills, it'll give you the chance to apply for better opportunities, since people notice that you are productive, a good leader, or a good communicator, being promoted is a big possibility, or getting that client for your business. It's a matter of building a reputation.

☑️ Same attitude to you

The golden rule is "treat others as you want to be treated". It's also a big possibility that if you show a good attitude due to your soft skills, you're gonna be treated the same way.

If you are a good colleague, you're gonna have better colleagues, if you communicate things well, you're gonna receive good communication, if you are a good employee, you're gonna have a good boss.

I want to mention something important with my last statement, you can argue that you're a good employee but you don't have a good boss, or you don't have good colleagues. That's why having strong soft skills is important for you. If you are not treated the same way, get out. As I mention, there are more opportunities for people with strong soft skills (there are many more for sure), better companies will agree on this and they welcome and value assets like soft skills.

📕 Soft skills list

Okay, too much talking, let's review and define some of the most important soft skills. I'm not covering all the concepts, but I'll give you some ideas for you to research a little bit more.

📳 Communication

Communication is the ability to express or deliver a message in a clear way. It seems simple, but it's not. Talking in front of people might be disgusting to some because the message has to be clear and you have to show that you know what you're saying.

Depending on the message you want to deliver, that's the way you have to adapt your tone of voice, body language, if it's a topic with some additional or special knowledge, you have to study a little bit more to express it.

It's also important to know your audience, are they elders receiving a technical topic? are they beginners in a specific field? Do you have to talk more technical jargon for important people?

I know, it looks like I'm talking about giving a speech, but communication skills are also included in a casual conversation, and it involves your listening skills. You have to understand feedback from the person that is listening to you and you have to do the same. It's one-to-one communication.

Communication will include your presentation skills, how you look and how you're perceived by others. Your confidence when talking and if you're paying attention while you're listening.

🤝 Teamwork

There's no I in a team. This is a good soft skill, having the ability to work with others, and work, in this case, means: cooperate, involve, include, plan and delegate.

Working with others is not an easy task, because you have to know that others can have a different way to do things, some of them will be organized and some will not. Maybe if you're not organized, you have to learn how to follow others' pace.

In the same way, you need to focus on being tolerant and respectful with others' opinions in which you don't agree with and understand that if you're in a team, it's because you have a goal in common you have to achieve with your partners.

💪 Leadership

Leadership is not (and it will never be) a synonym of bossing or supervising. The main difference is that a leader has followers because of their ideas and not because of their job role or position.

Maybe your boss is not a leader or if you are a boss, you may have a leader as a direct report. Leadership can be noticeable due to the grade of influence a person has over others.

There are two things (and many other more but those are important for me) that I think make a good leader, the first one is creativity and initiative, everything starts with an idea, but an idea is not enough, its execution will define if that's something worthy to work on.

That's why a leader is in constant activity, tight schedules, and several projects to do because taking initiative and creating is part of a leader's role.

The second thing that makes a great leader is an emotional intelligence, understand your own and others' feelings, and know how to react with it. Emotional intelligence is what leaders practice to gain followers.

If you can understand what others' goals are, react over them and mix them as a synthesis with your own goals, people will follow you and will agree on what you're planning.

🤠 Adaptability

The only constant thing is change. Being adaptable means learning new skills, change behaviors in response to the context, not being static, and doing the same things to obtain different results.

These days this is a critical skill for business, needs are new every day and if you want to remain in the competition, you have to innovate and adapt your company to the change.

I remember my marketing teacher saying that in the past, companies would sell products because that's what they had to offer, but nowadays, companies sell products because the customer is demanding them.

If you are adaptable, that means that you can walk along with the company's needs and goals. This term is also related to focus on improvements you can offer for the company, and to your personal life too.

🧠 Critical Thinking

Don't rush, evaluate and think over it. This is how you think about a problem, you define it, find its root cause and create solutions to solve it, then you evaluate how you do it.

This is important for decision-making and problem-solving, a person with this skill knows how to plan and how to execute with information that backs up their decision.

You even use this skill in technical tasks, like finding a bug in your code. You first understand what's the problem and what is expected, then you research to find its root cause and solve it. All that process sounds complicated because there are some steps you need to follow before you pass judgment about something, but rushing will direct you to make wrong decisions and to get carried away by the lame comments.

🤑 Negotiation

The emoji shows something interesting, money, indeed, it's related to money, people in the sales field must have these skills to close businesses. Negotiation is also a way to say, you win I win, that's why it's very useful in sales.

Not only do salesmen use this skill, but it also comes in handy when speaking with your boss for a promotion, or convincing your team members to do a project in a specific way.

Some skills you have to develop here are persuasion and confidence. It's also important to be a good communicator to deliver the benefits of the actions you want to take.

🤔 How can I work on soft skills?

There are more soft skills (and skills that are derived from them) but I don't want you to be overwhelmed. It's enough, that's not something easy if you're not used to be good at dealing with people, and not even a person that has experience on soft skills is perfect, it's a day-to-day learning curve, but I have some recommendations if you want to start working on that.

- 🚀 Understand what are your goals

Do you want to be good at dealing with people? Why? The last question is the most important here. Know what is your motivation, understand your goals. If you don't know where to go, why are you even trying? Having goals to reach (a promotion, a project, a client) will be the reason the main purpose of working on your soft skills.

🏋️ Fit your goals with soft skills

If you have goals, write them down on paper (or on a digital app, the one you use the most) and link them with soft skills. Search for a list of soft skills and create relationships with your goals.

For example, getting a promotion will be linked to negotiation skills, or starting a new project will link to leadership and teamwork and that's how you start your strategy. Those examples are simple, but I recommend you to be as specific as possible to identify required behaviors for your goals.

🙋 Ask for help

You might not be an expert, you need to get ideas and feedback from others because you're working on these skills for others. Asking for help will include reading books, subscribing to newsletters or YouTube channels that talk about this topic.

The best people to get help from are your superiors, talk to your boss about it, bosses feel good when a direct report wants to overcome the lack of skills. If you don't feel comfortable with your boss, search for a mentor, somebody you respect and you want to imitate because of their achievements (it could be your spouse or your mom too).

😌 Be actively patient

Soft skills are not something you learn overnight as I mention before, it's something you develop with time. Being patient means to wait, but not be laid on the couch until you magically have those skills. Baby steps are better.

You have your strategy, you need to be working on something every day, it doesn't have to be everything at once, but as long as you are doing a small task every day that gets you closer to your goal, that's enough, just imagine at the end of a year reaching your goal because you did something and committed to doing it.

Hard skills are important because they define the 'what' when working, but soft skills are also important, because they define the 'how' when working, specifically with others.

🤷 What is this for?

The spread operator is used to expand elements from one array to a new array or object. Simple like that.

Without this operator, creating new arrays from existing ones will be very difficult, let's see some examples.

Let's say we have two arrays with some elements and we want to combine them in one array. As a JavaScript beginner I could think of the following solution:

const array_1 = [1, 2, 3];

const array_2 = [4, 5, 6];

const newArray = [array_1 + array_2];

But definitely, that's something we don't want, it'll give us a string as a value and they're not separated:

const newArray = [array_1 + array_2];

console.log(newArray);
// ["1,2,3 4,5,6"]

Or maybe just adding some values and then the array I want to add, but that won't work either, because they will still be separated.

const newArray = [1, 2, 3, array_2]

console.log(newArray)
// [1, 2, 3, [4, 5, 6]]

A real solution is to add every element of that array, we can also loop over elements.

// ADDING ARRAY ELEMENTS MANUALLY
const newArray = [array_1[0], array_1[1], array_1[2],array_2[0], array_2[1],array_2[2]];

console.log(newArray);
// [1, 2, 3, 4, 5, 6]

// OR USING A FOR LOOP
let newArray = [];

for(let i = 0; i < array_1.length; i++){
newArray.push(array_1[i]);
}

for(let j = 0; j < array_2.length;j++){
newArray.push(array_2[j]);
}

console.log(newArray);
// [1, 2, 3, 4, 5, 6]

But that's too many lines of code that can now be simplified with the spread operator. The only thing you need to do is add it to your new array and it's done.

const newArray = [1 , 2 , 3, ...array_2];

console.log(newArray);
// [1, 2, 3, 4, 5, 6]

That's cleaner than doing extra calculations. All the values are taken out of their arrays and they are added individually as if we were doing it manually. You can also use the spread operators in as many elements you'd like to add:

const newArray = [...array_1, ...array_2]

✅ Copy of an array

Copying an array is not doing Ctrl + C and Ctrl + V. There are some cases in which we may need to modify the values of an array, but we also need to keep the values of that array intact, because it's used in a different function or depending on your needs.

So, we have this array and we want to create a copy of this, we do the following:

const cars = ['toyota', 'nissan', 'honda', 'hyundai', 'kia'];
const myCars = [...cars];

Now we can do any change in the myCars array since it works as a shadow copy and keeps cars intact.

✅ Concatenate two arrays

You can use the great method of .concat() however the spread syntax makes this easier, as we previously saw it with the example:

const newArray = [...array_1, ...array_2]

✅ Can I use it with strings?

We confirmed that the spread operator is very useful in arrays, where there are multiple values, but would the spread operator work on a string? Yes, it will.

Strings are iterable objects in which we can define or customize their iteration, in plain English, we can create functions or do any operation with each element of their value (Iteration protocols is an interesting topic, I'll research about it and I'll summarize ideas soon).

So, for example, we have our string 'David' and since it's iterable, I can loop over each letter and execute a method or a function and that's how we use the spread syntax.

const myName = 'David';

const spelling = [...myName];

console.log(spelling);
// ["D", "a", "v", "i", "d"]

That's a cool feature because it makes everything easy. Just as a reminder, it's that you can only use the spread operator in scenarios where we can add multiple elements separated by commas like an array or a function.

With that being said, it's not possible to spread a string in template literals:

const myName = 'David';

console.log(`My name is ${myName} and it spells ${...myName}`);
// Uncaught SyntaxError: Unexpected token '...'

That happens because the embedding expression is not a place to add multiple values separated by commas.

✅ Spread operator as function arguments

The spread operator works as destructuring elements of an array or an object, the difference is that the spread operator takes all the elements from the array but it doesn't create a new variable, so we need to only use it in places where we write values separated by commas.

That's why we can use the spread operator as an argument of a function because remember that spreading values means adding multiple elements individually.

const colors = ['red', 'blue', 'green'];

function favoriteColors(color1, color2, color3){
   console.log(`My favorite colors are ${color1}, ${color2}, and ${color3}`);
}

favoriteColors(...colors);
// My favorite colors are red, blue, and green

We didn't need to do something like function(colors[0], colors[1], colors[2]) and that's why it's very useful to spread values, it is a great update, because it follows the DRY principle (Don't Repeat Yourself), making things clearer and organized in your .js file.

Spread syntax on objects(?)

As per MDN, once the spread operator was created, it was intended to only work on iterables, and objects are not iterable, so you couldn't use it, but after ES2018, you can now use it with object properties.

So feel free to make shadow copies of the properties of your objects into new ones. Let's check the example from the previous blog post

const sellers = {
      asia: 'VendorA',
      america: 'VendorB',
      europe: 'VendorC'
   }

const vendors = {...sellers}

console.log(vendors);
// {asia: "VendorA", america: "VendorB", europe: "VendorC"}

Or you can also integrate the properties of the object in a new one, so their values will expand.

const nissan = {
   name: 'Nissan',
   model: 'Sentra',
   year: 2015,
   color: 'black',
   isAutomatic: false,
   ...sellers
}

Technology is fascinating and how it's being improved every day, hope you enjoyed and learned something today, see you in the next one.

In our previous blog post we went through the importance of destructuring. I'll mention what it is again:

Destructuring is to unpack values in an array or object properties and pack them into different variables. In other words, making a complex data structure to a more simple one.

The same as we did with arrays, we are going to do it with objects.

Instead of square brackets [ ] now we are going to use curly braces { } to destructure. As you know that's the main difference between an array and an object.

🤷 What's an object?

An object contains a set of information defined as properties, and every property has a value. Let's continue working with car examples.

const nissan = {
   name: 'Nissan',
   model: 'Sentra',
   year: 2015,
   color: 'black',
   isAutomatic: false,
   availableRegions: ['asia','america','europe'],
   sellers: {
      asia: 'VendorA',
      america: 'VendorB',
      europe: 'VendorC'
   }
}

With several properties, maybe we just want to extract specific information, and here's where we have our friendly destructuring feature.

✅ Destructuring an object

As I said before, the way we're going to destructure elements is by using curly braces. However, the main difference is that we're going to specify the name of the properties and the order does not matter.

const {name, model, availableRegions} = nissan;

Like arrays, doing the previous code will create new variables per property.

console.log(name, mode, availableRegions);
// 'Nissan', 'Sentra', ['asia','america','europe']

It's very useful when working with APIs, I worked on a small project that gathered information from the icanhazdadjoke API and it's formatted as JSON, if you don't know what JSON is, it's like a way to organize data in form of JavaScript objects.

Destructuring comes in handy when we have to deal with APIs like that, the project above is funny, but it's the same when it comes to job projects. NoSQL databases may have that format, we can have that topic for another blog post but the main idea is that destructuring is really important.

✅ Changing variable names

If we want to change the name of the variables, we need to add the property name and define a new name with a colon (:).

const {name: carName, model: carModel, availableRegions: continents} = restaurant;
console.log(carName,carModel,continents);
// 'Nissan', 'Sentra', ['asia','america','europe']

✅ Default values

When we receive API data (data from another site), sometimes we can encounter that some objects don't have the property names we set on our js doc.

That's why we use default values, and we can set them as the following with the equal (=) sign:

const {style = ''} = nissan;
console.log(style);
// ""

We defined the variable style however, taking a look at our sample object, it doesn't have it, so, if we want to use that property, it'll return our default value.

✅ Assigning new values to variables

If we want to change the value of a let variable, we can define them in our destructured data.

Since we're using curly braces to destructure our object, JavaScript will throw an error trying to use them at the beginning of the line. We could do that with square brackets but not with curly braces. The reason behind this is curly braces represent a block of code.

We're not creating a new block of code, but mutating an object, to avoid that error, we use parenthesis and curly braces with it.

let a = 'I am data';
let b = 'I am other data'
const sampleObject = {a: 2, b: 5, c:7};
({a,b} = sampleObject);

Now variables a and b are not the string values we see at the beginning, but they are converted to new values from destructuring.

console.log(a,b);
// 2, 5

✅ Nested objects

In our sample object, we can see that the value of the sellers property, contains another object. Let's check how does it look like by destructuring that property.

const {sellers} = nissan;
console.log(sellers);
// {asia: "VendorA", america: "VendorB", europe: "VendorC"}

But what about if we just want to know the name of America's seller? Of course, we can do sellers.america however we're not saving that value in a variable, and if we do it, we're writing another line of code.

So destructuring objects solve that problem for us in the same line of code:

const {sellers: {america}} = nissan;
console.log(america);
// 'VendorB'

We can also name it differently by using the syntax we learned before.

const {sellers: {america: americaVendor}} = nissan;
console.log(americaVendor);
// 'VendorB'

✅ Destructuring objects as a parameter of a function

It's wonderful the things that you can do with destructuring, and this is a very useful use case we have. We can destructure a parameter as an object.

Let's use our sample object and create a method:

const nissan = {
   carPurchase: function({customer, date, time}) {
console.log(`Congratulations ${customer}, you bought a ${this.name} - ${this.model} on ${date} at {time} Enjoy your car.`);
  }
}

Notice that I've added curly braces as parameters, they are not three parameters but just one destructured as an object with three properties.

If we run the code above, it should return our data:

nissan.carPurchase({
customer: 'David Salomon',
date: '2021-02-24',
time: '07:30 a.m.'
)
// Congratulations David Salomon, you bought a Nissan - Sentra on 2021-02-24 at 07:30 a.m. Enjoy your car.

You can go even further, by adding default values to the destructured object within the parameter, as we learned before.

That feature is really useful if you need to create a function with several parameters, it's better to have them in just one object.

You know that I'm a beginner and I'm studying hard to be a web developer. I'm focusing on JavaScript and I want to start a series called: Data structures.

I'm following along the Jonas Schmedtmann JavaScript course and I got to the Data Structures section, it's very technical and if you don't have a good motivation, it can overwhelm you.

There are a lot of blog posts and videos about this topic, but as a way to learn, I want to share my notes about this section, it'll help me to understand it better if I can explain it well and I hope it helps you to understand this topic clear, and if I make a mistake, please don't hesitate to leave a comment and correct it, I love feedback.

So, let's start.

🤷 What's a Data structure?

Every programming language has a data structure, it's how all the information can be organized depending on your needs. With that organization, you can access, modify, create or delete data.

If you need to solve some problems using a programming language, first of all, you need to gather the information and organize it, depending on the programming language, you can take different approaches.

In JavaScript, there are a lot of ways to organize data, (check MDN to see the full list), but the most common ones are arrays and objects, which are the ones that we are going to focus on in this series.

🤷 Why do I need to destructure?

Destructuring is to unpack values in an array or object properties and pack them into different variables. In other words, making a complex data structure to a more simple one.

Sometimes information is not received in the way we want it or we need it, so we have to extract that data and convert it into a different variable.

For example: I have an array of car models:

const cars = ['toyota', 'nissan', 'honda', 'hyundai', 'kia'];

But I need to get the model name because I'll assign an owner list to each car model.

As a beginner this could be a possible solution:

const toyota = cars[0];
const nissan = cars[1];
const honda = cars[2];
const hyundai = cars[3];
const kia = cars[4];

🙋 How to destructure arrays?

The code above is too repetitive, don't you think? So here's when destructuring comes to play. The way we will do it is by adding square brackets in the name of the variable like this:

const [toyota, nissan, honda, hyundai, kia] = cars;
console.log(toyota, nissan, honda, hyundai, kia); 
// 'toyota' 'nissan' 'honda' 'hyundai' 'kia'

In that simple way, we saved 4 lines of code. Translating that a little bit means that every element on the array will be created as a new variable. The name of the variable will be taken by looking at the order.

Toyota will be 'toyota' because it's the first value in the array cars[0]. You could pick a different name if you want, but since we want to make this as clearly as possible, I suggest you do it with the same name to not get confused, but if you're very comfortable with your code, you can also do it like this:

const [carNum1, carNum2, carNum3, carNum4, carNum5] = cars;
console.log(carNum1, carNum2, carNum3, carNum4, carNum5); 
// 'toyota' 'nissan' 'honda' 'hyundai' 'kia'

I definitely wouldn't recommend you that, but it's just to clarify the point that a new variable has been created as carNum1 and it will take the first element in the array that is 'toyota'

Destructuring data won't modify the array, it'll remain intact because you're creating new ones.

✅ The order matters

Destructuring arrays will only take the elements in the array, based on the order, however, if there are more elements than variables, it'll take just the variables you have stated.

Let's see it in code with the cars variable:

const [toyota, nissan] = cars;
console.log(toyota, nissan, honda);
// Uncaught ReferenceError: honda is not defined

Why does that happen? It's because we're not creating a variable for honda, just for the first two elements.

✅ Skipping variables

What about if I need to take just the first element toyota and the third one honda. You can skip elements by leaving a blank space separated by commas when declaring the variables, like this:

const [toyota,  , honda] = cars;
console.log(toyota, honda);
// 'toyota' 'honda'

✅ Switching variables

We saw that the order is very important, but what about if I want to save the elements in the new array but sorted differently.

A beginner solution would be creating a temporary variable to have the switched element.

const array = ['main','secondary'];
let [main,secondary] = array

const temp = main;
main = secondary;
secondary = temp;

console.log(main, secondary);
// 'secondary', 'main'

In the end, that solves the problem, the only thing is that we have to use a temporary variable, to not modify the original value, but again, it's too much code, and also you can be a little bit confused by the way you're assigning variables (I'd be confused too).

Destructuring helps us to solve the switching part in an easier way:

[main, secondary] = [secondary, main] ;
console.log(main, secondary);
// 'secondary' 'main'

✅ Destructuring from a function

You can be more creative by getting the values from a function. Imagine I want to pick a normal car and a luxury car model for the week, let's see this example:

const normalCars = ['toyota', 'nissan', 'honda', 'hyundai', 'kia'];
const luxuryCars = ['mercedes','lexus','bwm','ferrari','lamborghini'];

function pickACar(normal, luxury){
    return [normalCars[normal],luxuryCars[luxury]];
}

const [weekday,weekends] = pickACar(1,2);
console.log(weekday,weekends);
// 'nissan' 'bwm'

We went to advanced here, but it's a cool example. So, what I'm doing is to have two arrays, one is normalCars and the other one is luxuryCars, I'm creating a function that accepts as parameters one normal car and one luxury car, they will be numbers because the function will return the position of the arrays.

So far, we're not destructuring, but if we execute the function and save it in variables like [weekday,weekends], the return values will be stored on those variables.

✅ Nested arrays

Believe me, I understand that overwhelmed feeling when things are nested, because as a beginner, you have to go to the child element to understand its parent and so on, but it's a matter of getting used to it and studying them more.

In destructuring, nesting is not an exception. So, we can do it for arrays that have nested data:

const nestedArr = [1,2,[3,4]];
const [individual, ,nested] = nestedArr;
console.log(individual, nested);
// 1 [3,4]

As you noticed, it shows the first value in the individual variable, we skipped the second one and the nested variable is the nested array nestedArr. But what about if we want to include all the numbers from the nested array. We have to destructure the nested array too.

const [individual, ,[nested1, nested2]] = nestedArr;
console.log(individual, nested1,nested2);
// 1 3 4

Some advanced developers have another solution for that, but we're gonna leave it for another blog post, but I wanted to show you that it's possible to do it in that way.

✅ Default values in destructuring

There are some times in which we don't know the number of elements that an array has, or we don't know the type of data that it could have.

const [a, b, c] = [1, 2];
console.log(a,b,c);
// 1 2 undefined

That's why we can create a default value for our variables, so if the variable doesn't find any element in the array, it will show the value set by default:

const [a = 5, b = 5, c = 5] = [1, 2];
console.log(a,b,c);
// 1 2 5

We define defaults by adding the equal sign next to the variable, the same as we do with parameters in functions. It's very useful when we use data from a third -arty provider or API.

Thank you for reading, see you in the next part of this series.

Part of my story is that I was refrained to study English until I saw my friends earning more money than me in a cool environment.

I definitely changed my mindset, I learned English and I got the job and I felt good.

But you know, there's this specific time when the fun curve is starting to decrease while at work, you realize that you've got into the comfort zone again. You can feel me and you start looking for more job opportunities.

Technology is an interesting field in which you and I have the opportunity to participate in the job market with many benefits and several companies to apply for.

I started learning web development the last year due to the pandemic and I found that I can apply some techniques I used to learn English, and it seems to be working to learn to program (specifically in JavaScript).

- Master the basics

Would you like to develop the next Facebook? You won't get it if you don't know how to do some iteration or loops in the programming language you're studying. Knowledge has to be built from basic to advanced. Sounds logic? I know, but we as beginners fall into the trap of trying to learn a lot of things at the same time, and when we try to solve a simple coding challenge, we can't seem to find a solution.

When I learned English, I wanted to speak like those guys selling stocks over the phone, the ones you see in movies, being fluent and very confident in my words, but I didn't know how to express sentences in present perfect.

I realized that I wouldn't get too far if I wouldn't have learned the basics of the language first to work on my fluency. It was necessary to go step by step in my learning curve.

Applying that to programming, most of us want to learn how to use a library or framework instead of mastering the language. To be honest, I'm really tempted to learn React right now, but there are many basic things that I haven't mastered yet with vanilla JavaScript.

I don't mean to be just in a comfort zone of the basics, going too deep with the learning process, but what I really mean is to master the basics by doing little by little, in a logical way. Once you learn something, then add another topic to master. You won't notice how far will you go.

- Practice everyday (create a habit)

This is something that you listen to a lot, and this blog is not the exception.

Practice makes a master, so if you're just watching courses, YouTubers, gurus, etc, and you're not typing into VSCode (sorry, or the editor you prefer), then you won't go further.

I learned English by studying every day, I really wanted to overcome my financial situation, so it was a motivator (I suggest looking for one), and I was working in a full-time job.

I remember I used lunchtime to watch Friends, it's a series that helped me out with my English, it was fun, but besides that, I was writing down all of the words I didn't know, and that was some of my practice.

I made the habit of watching 'Friends' to have a new vocabulary, I also studied at nights by reading articles in English and thinking and talking to myself as a practice. Now, answer the question, what can you do every day to practice in programming?

- Practice with others

Most of the people I know that are studying programming (or they are programmers already) are less social, so they won't talk to anybody unless it's needed.

I am that type of guy too 🙋, even though I can express a lot of ideas and try to be very kind and friendly with others, I'm not too social to talk to somebody, I prefer to work by myself.

However, the power of team-working is enormous, because what you have to look is for feedback. Big companies grow because of feedback, so why don't you take that advantage? I'll give two reasons why you have to practice with others.

The main one is that you are being corrected by others. People more experienced than you will tell you what you have done wrong and how you can improve it. You need to be humble and accept what needs to be improved and do it.

Sometimes you feel you're doing things well but you don't have a full overview of the things you're doing, you need to have some external eyes to criticize your work.

The second reason is to provide feedback, I provided feedback when I learned to speak English to other people. I was good at English grammar in high school, the only problem is that I wouldn't speak at all (just reading and translating), but some other people were too bad at grammar too, so I had the opportunity to join English conversation clubs and practice with them.

I was able to provide feedback and I noticed that I learned even more when teaching others, so it was an interesting way to learn because I have to structure my explanation, even investigate a little more to back up my answer, and express my ideas.

Interesting fact, I've been doing the same on Stack Overflow, I'm not an expert nor a Senior developer, but I've been answering questions in which I have a slight of knowledge, and it has been good, I investigate before providing my answer and I think myself how to express an answer the clearest possible, so I can understand what I'm talking about. You should try to do it too.

- Make mistakes

Speaking fluently was my big area of opportunity back in the days, but I was able to overcome it by making mistakes.

Mistakes are part of the process for success, so I made mistakes but learned from them. I often mispronounced some words or I unordered the logic of sentences in English, that was a mistake.

Being afraid of making mistakes is not good at all, if you are, you won't achieve your goals. Mistakes are translated into experience.

Of course, mistakes won't help you out if you still make them, but definitely, they will help you out a lot if you learn from them, to do that, first, you need to be open to make mistakes and then overcome them. That's the only way.

I know you will write 100 lines of code that can be done just in 20, but that's the way you learn, senior developers are not born with all the JavaScript skills, they learn them, so you must do the same, they spent time as you're doing right now, stick to it and keep it up.

- Stay motivated

Motivation is the key, I was motivated because of a new salary that would help me out, and I got it. Now, it's time to focus on a new motivation and a way to do new things to achieve your goal.

In fact, if you don't have the motivation, likely, you won't get what you want, because you don't have an engine that moves you up to get what you're hoping.

Money is a good motivation, it was my motivation at the beginning, but then I realized that there are better reasons to achieve what you want, such as being comfortable at work, build innovative things, put your creativity to work, and be happy what you do ('cause it's a 9-5 job, the third part of your life is working based on that).

Pointing to a good goal will make you enjoy the learning process, so make sure that what you're pointing at is worthy.

- Challenge yourself

I already mentioned that being in the comfort zone is not good at all, so it's time to challenge yourself in three ways:

a) By mastering the basics, if you really master the basics, you're expected to solve any coding challenge, so test yourself and confirm that you're able to do it, otherwise, go to the piece of advice number one.

b) Adding topics to your knowledge, after mastering the basics, find something new to learn that challenges your mindset and keeps you on the PC for hours, make that time worthy, and overcome any problem you encounter.

c) By being brave and start applying for jobs, I remember I applied for jobs even I had a bad English level (companies in El Salvador require an 85% of English Level). I was rejected but I asked for feedback and that helped me out learning more about what I needed to improve.

It's time to master your skills, you can do it, it's just a matter of practicing by making a habit and discussing this with somebody else. Find a good motivation and overcome what you have set as a goal, you're in charge of your present and future, so let's do it.

As you may know, I'm a simple guy learning web development from scratch. I work in a full-time company as a tech support specialist but I want to get a job as a front-end developer someday.

Nothing is easy, you have to study and practice to reach your goal, trying to find some time to code is difficult, but when you have a goal in mind, nobody can stop you from reaching your goal.

Brad Traversy and his course

I went to the doctor two months ago and while I was waiting, I was scrolling down on Facebook, when suddenly I saw a post about Brad Traversy releasing a brand new course on Udemy called 50 Projects In 50 Days - HTML, CSS & JavaScript.

I didn't know Brad's methodology, and so far, I'd been learning pure theory. I did some web projects with HTML and CSS, they were good and I was excited to learn some new things during the pandemic, but I hadn't made projects that include JavaScript.

There was a promotion code for the Udemy course and well I took it to see how it looked like and I can tell you that I took advantage of it. Brad is a great instructor, he's the guy that goes directly to the point and shows you how he'd do it without silly jokes and with a normal pace, in which you don't get bored of the explanation and he neither goes too fast with it.

The course

The main objective of studying the course is to create 50 small projects including HTML, CSS, and vanilla JavaScript in 50 days (intended to be one per day), and in every project, you apply theory to practice.

What it was interesting to me is that all of the projects are intended to be components, I mean, that you can use that piece of code to include it on a big project, because they are features that you find in most of the websites on the internet.

In the beginning, I felt overwhelmed with some other courses I bought and 50 days sounds a lot, but I started following the course while coding.

After creating the habit of doing one project per day, I became more excited about it, because, in every project, you apply something new. I had never coded with DOM manipulation, that's the point where you start to like JavaScript, manipulating things on your website is when everything you've learned about loops, variables, objects, arrays, and so on makes more sense.

I completed the project and I'm really grateful for what I've learned. You can see the 50 projects on https://50daysproject.vercel.app/

I know, I don't want you to get bored with my experience, in fact, I want to give some recommendations about what I've learned and how to take advantage of this type of course.

1. Do one project per day

This recommendation has two faces, the first one is to do one project per day to not get overwhelmed. What happens is that if you do three, four, or six projects in one day to finish the course quickly, you're not going to learn the essence of each project.

Some researchers say that it's probable that you are going to forget 70% of the things that you experiment within just a couple of days. Completing the course must not be an objective, the objective must be learning.

So, take it easy, 'cause you should buy courses to learn, not to have a certificate.

On the other hand, do one project per day to create a habit. I know, it's difficult, I can tell you while having a full-time job and studying a Bachelor's in college (that's not related to software development), so make a slot in your calendar to do one project, complete it.

First days are harder, but when you force yourself at least in the first week, you're gonna enjoy it and even you're gonna find a necessity of completing the next project the next day.

If you have a goal in mind, such as getting hired as a software developer and improve your lifestyle in a tech job, make space to do it. After you complete the course, then you're gonna be looking for more projects to create.

2. Apply your personal touch

The course projects are available in a repository on GitHub, and you know that's something easy to copy and paste and create yours on a repository, but that's not the point of studying a course.

I rely on your abilities to use Ctrl + C and Ctrl + V, but that's not gonna get you to stand up out of the crowd. You might want to personalize your projects and make sure you are recognized for your effort.

I noticed that in the way Brad was doing the course, all of the projects were separated into different folders, without any relationship, and due to my OCD, I wanted to organize them with numbers and make a sort of portfolio where you can access all of them.

That's my personal touch, I added a sort of a navbar on every project where you can go back home and you see the title of the project. So in that way, people will confirm what's the name of the project, the section number and they can see the list of features I created following along the course.

I know you have better ideas than me and your creativity will show up, so it's time to do it with this course.

3. Follow along but experiment

In every project, Brad talks about the importance of adding our own features and improve the project.

He had some ideas on how his projects could be improved but that's something you have to do. Remember that the most important thing is to learn by yourself.

I know about the power of repetition and believe, I learned from it, because in every project, you do almost the same things, like creating variables for the elements in the HTML, doing a loop (either forEach or for-loop) in arrays with similar elements, conditionals, and some logic.

Everything above is very useful, but when you modify those things and break the project, is when you start learning for real. At the end of the course, you have that sense of responsibility to improve what you have done. So, it's time to do it.

4. Merge them into a big project

Every feature you make in the course it's very useful in real-life development, you can see how the features you created are used in websites you often visit.

I always find it interesting to know how nice features are made in code and when you do them, you feel very excited because you know the steps and the logic behind that feature. It's like knowing a secret and realizing how useful it could be in your personal projects.

The great advantage of the course is that you can create components that can reusable in different website. For example, a gallery of images , a loading icon , a to-do list , a notes app , a background slider , drag and drop effects , a landing page , a password generator , testimonials , etc.

Every mini project is a feature that you can include in a social media app, a productivity website, features you can do at work, or if you are not thinking about a specific product, you can do it to include it on your portfolio and show it to the recruiter in the company you apply to get a job.

5. Have fun

I think this is the most important recommendation, 'cause if you're not enjoying what you're doing in coding, maybe a software development job is not for you. I know from some friends that are developers, that sometimes they can be very stressed about their jobs, but they explain to me how exciting is to find a solution to a bug or create a special feature that looks and works really nice in a company's website.

Somebody said that if you choose a job you love, and you will never have to work a day in your life, maybe Confucius wasn't right or maybe he was, but the point is that while you're learning, you need to feel happy about what you create.

In the course we did some funny projects too, I learned and also I laughed at some projects such as the Dad's jokes generator, the insect catch game or the Pokedex.

The course helped me a lot on how to practice many things, something new I've learned is how to make API request in JavaScript, and even though, it's still a hard topic for me, I find fun in it, because I know I can create new things from that knowledge.

Keep on practicing, it may be hard, but if you really want to switch careers, you'll put your efforts into it. In the end, you'll feel satisfied with what you have learned. We have a saying in Spanish that says "El que sabe se divierte" which means "The one that knows how to do it, has fun", so, if you want to enjoy your career, first you need to put your efforts into learning and you'll get it.

Too much info there...

The Internet has been one of the best inventions in history, with it, we can establish communication bridges over long distances. This makes it easy for the information to be disseminated. There is so much information on the internet, that you can even get bachelor's or master's degrees online, something that we didn't expect 20 years ago.

You will know me as the guy switching from a non-tech job to a developer career, and it was overwhelming to know that there's a lot to learn when it comes to programming and web development.

After I completed one topic, I immediately opened the next one and when I finished it, I didn't longer remember many things about the first one.

Being an eternal student can be shocking, but I realized that filling us with knowledge is not enough if I don't apply what I've learned, I understood it and that is why I want to give you five recommendations to get out of the trap of learning paralysis

1. Start with the end in mind

When studying a topic, you should set an objective, which will help us to check if we are learning or not. When you start a new course, you must ask yourself the question: Why and what do I want to study this course for?

It is very common to start taking many courses without having the real objective of using that knowledge in the future. An answer like "I will learn CSS and JavaScript because I love web development, I am very visual and I want to get a job in a big company making websites dynamic" is very punctual and objective.

I'm not saying it's wrong to take courses just for general knowledge (such as binaries or history of computers) but you would use more of your time focusing on the ones that align with your highest priority.

2. Create a learning cycle

I am a self-taught student, (thanks to freeCodeCamp, Udemy and many other online platforms) so I apply a special process to the courses that suit my most important objective. This process consists of three parts:

a) Know what you will learn

Do some research on what you are going to learn, you can read blogs about the subject of the course, watch videos about general concepts or read the comments, and description of the course, it will help you understand if the course will interest you, so you will meet prerequisites and you will not get from scratch to the first class.

b) Learn by doing

In programming courses, it is very important to follow the teacher with code, as you can experiment while the class is reproduced. Apart from that, you might want to pause and you can experiment with other values, attributes, or formulas. Besides, all your senses participate actively when practicing while you play the class.

c) Practice what you have learned

At the end of the course, I bet that only the basic topics to be learned are taken, but you can get a lot out of it if you create a project from scratch applying what you have learned because that is the true practice. You will find yourself locked in bugs and you will have to do a lot of research on why a piece of code does not turn out the same as the teacher said. You will encourage creativity and you will be able to exercise your knowledge.

3. Eliminate the perfectionist in you

Many times I fell into the trap of waiting for everything to be perfect (the project, the technique, the time) to be able to do things. In the end, I realized, that perfection never exists, there are always areas of opportunity in which you can improve.

What happens with being a perfectionist is that we wait so long to have the perfect project, that in all that time we spend studying and not practicing because you must understand that this will be the only way to reach perfection by doing.

My recommendation is that you start with small projects in which you apply what little you have learned, which will increase the dexterity and abilities for larger projects. Those projects will never get better if you don't start practicing.

4. You will never know everything

There comes a point where you want to learn all the technologies, to be able to do a project. Interestingly, when you finish mastering a certain language, an update comes and you will have to get used to new things.

As well as the changes in JavaScript ES6 or going from positioning elements in web pages using HTML tables or absolute and relative positioning in CSS and not to mention flex and grid.

The lesson of this tip is to focus on what is most important and learn it. General knowledge is good, but that kind of knowledge will not help you achieve your professional goals if that is what you want. You need to focus.

Also, trying to know everything can lead to frustration when you realize that you won't be able to. So focus on what you have decided, to meet your goals.

5. Find a team

A team helps you integrate knowledge, since we have learned that you will never know everything, other people will know how to do what you cannot, so by building teams involved in a specific field, you can put together bigger things.

Networking is an important skill today, you should know that if you want to do something great, you can't do it alone.

For example, when designing a website, of course, you can do it yourself, without any help if you have frontend and backend experience, but if you want to scale, it will take forever to get your project done and the to-do lists will seem endless. On the other hand, by distributing tasks among the members of your team, it will be much easier and you will be able to deliver a better job by having known how to focus everyone's knowledge on specific branches.

If you keep learning, create your group in social media or community in Hashnode, where everyone is interested in technology. Create imperfect projects, focus on the little, set goals and create your learning cycle.

There are no excuses to continue falling into the eternal-student trap, close the book and start working on it!

Making the decision

When I finished high school as an accountant, I entered college to be a great lawyer, one of those who do not lose cases and are very arrogant 👨‍⚖️.

Little by little, when studying the degree in 2015, I realized that there were many lawyers in a country with such a small population (low demand) and also being an arrogant person is not good at all.

I sponsored my studies with my job as an accountant, in El Salvador, a minimum wage is sometimes enough to maintain a college degree. However, I noticed how my friends got well-paid jobs, either because they knew how to speak English (My native language is Spanish) or they decided to take programming courses and were hired by big companies to solve big problems 👨‍💻.

That comparison made me feel obsolete 😞 and I decided to embark on the journey of learning to learn from scratch, getting the pride of starting over, to go with the flow of the world and be prepared for tomorrow 💪🏼.

Some pieces of advice

This blog post is for those who have started their developer career journey, be it either design, digital marketing, or programming, or for those who have not yet decided to change careers and are tempted to do so. Hence I give you some tips that helped me to make this trip a little more friendly 🤗.

Establish your professional purpose

Do you want to specialize in a branch of technology because you want to or because it is what everyone does? It is important to define our efforts for something valuable 🏅.

If you are not interested in technology, that's fine, you don't have to go from your current job to another one just because people do it around you.

I felt obsolete seeing that everyone specialized in something that is being a boom in this 21st century: technology. However, it is a very personal thought and it might not be the same as yours. Each person has their motivations when acting and you must continue doing what makes you happy and feel comfortable 💆‍♀️.

If you are comfortable where you are and you feel happy doing something in your life that is not related to modern technologies, I hope I have helped you so far, in making you understand and reaffirm your professional purpose in this life. Thank you.

Create your realistic plan

If you continue reading my article, it means that you are not comfortable with what you do (if it is not related to technology), that you felt almost the same as me. So, having established a professional purpose, it is time to make a plan 🤔.

I planned to learn English to work for a bilingual company and thus learn to give technical support to clients in the IT world. Get used to the environment and be hired as a front end developer to be a project manager and start my venture in less than ten years 🚀.

That is my plan, you will have other ideas, another time limit, or other hobbies with which you feel comfortable. What is essential is that you set the phases, specialize in them, and respect the times that you have defined, being realistic so that you can achieve it.

Master one phase of the plan only

If you noticed, my plan is a ten-year limit. It sounds overwhelming at first, but it frees me from frustration by not getting excited about unrealistic times. But why so long? 🕰️ If you want to achieve a final goal, you must focus and specialize in each of the phases of the plan that you have designed. Position yourself in your comfort zone and then extend it.

You will find the path very difficult if you start learning React.js without knowing HTML. Or if you start studying for a Scrum certification without having participated in a project 🤷🏽‍♂️.

My story can be summed up in that I was an accountant and, having mastered accounting at my job, I studied English to be hired at a customer service company. After mastering English, I prepared myself with the knowledge of the internet, DNS, protocols, and emails to enter a technology company.

Now I'm still in the same company, mastered that skill, and continue in a position that supports the team with small projects, such as performance improvement, data analysis, and team management.

Currently, my focus is on mastering front-end development thanks to my mentors, my side projects, and online courses. If someone has told you that you could learn a skill in a week, maybe they just have excited you to sell a lame course.

The truth is that to master a skill, based on my experience, you need 6 months to a year to feel it a developed skill. Of course, do not get too stuck, when you feel ready for the current phase, start with the next ➡️.

Network and work for free

Many of the skills I have learned is thanks to working for free, either as a volunteer or as an extra activity to my full-time job.

I know that many people hate working for free, but trust me, it is a powerful tool when you are learning. It allows you to execute a role without being part of it officially, the learning curve is reduced and it prepares you for a position in which you can obtain financial benefits 🤑.

Add a good contact book and you will be unstoppable. It troubled me to talk to people in other departments (like Business Analyst) to learn from them and prepare for a similar position in the future. But the truth is that this is that I understood how important it is to obtain new skills 🧏‍♀️.

If you get to these people and present yourself as someone who just likes to receive knowledge, you will be unattractive for someone to help you. On the other hand, if you offer to work for free, you get respect, much more knowledge and appreciation, that will help you in future opportunities.

Have a good time

Nothing is easy, everything requires time, discipline, effort, and a lot of patience, but it is useless if you are angry because a project did not go the way you wanted, or if you are anxiously waiting for the day when your professional purpose is achieved or even if you spend time being frustrated because the opportunities do not come as you expected.

I'm happy when I do a short script that summarizes a ten-minute process in just three seconds or when the complex formula I've been working on, works the way I want it. So much so that I even think it is magic ✨, although for an experienced programmer it is such a simple thing. The best thing is that you learn to find pleasure in small things and repeat them, the important thing is that you feel good.

Master each phase of the process and have fun with it. Everyone has been through it, you are not the first to want to improve and you will not be the last. I always keep in mind that we only have one life and we have to take advantage of every minute, I hope that minute is not one of bitterness, but one of joy and comfort 🤗.