7 Steps to Learning a New Skill

Introduction

Many of you might have tried learning a new technology/skill, either through online courses or tutorials. But following such a path, you might have felt a drop in motivation thus leaving the task unfinished. If this sounds familiar, I completely understand your pain. In this blog, I’ll be talking about my journey of learning a new skill i.e. web development having no prior experience at all!

Note: I would highly recommend reading the whole blog if you can spare a few minutes. But if you are short on time, you can skip reading and move to the end of this blog for a diagram summarising my approach.

Step 1

Understanding Your Why and How

Write down your goal, think about how you would define success, and use that to fuel your objectives. You can also research technologies that are currently being used in industries relating to your goal thus better directing your objectives. This step can be painful and might seem futile to some people, but doing this reduces fuzziness, thus making your learning journey easier and fun. In my case, I focused on exploring web development at a high level by touching various aspects of it rather than getting good at a single aspect only.

Finally, think about what would be hard to achieve and make them your stretch objectives. Example;

Aim

• Develop a web application conforming to industry standards

Basic Objectives

• Develop a React-based application for front-end
• Develop an Express-based orchestration layer for serving requests
• Interact with publicly available APIs to gather, process, and present data
• Experiment with basic components such as tables, forms and images, etc
• Experiment with CSS and other styling tools
• Ensure a simple and secure system design architecture is followed

Stretch Objectives

• Host the application on Cloud using AWS
• Create and publish Docker images

Remember these objectives are a mere guide and are NOT set in stones. As you explore and identify new opportunities, make sure to update these.

Step 2

Building a Strong Foundation 💪

Just like a tree with strong roots is capable of growing bigger, it is important to build a strong knowledge base before diving into your project. Having this knowledge will enable you to identify growth opportunities that were not visible earlier and use them to update your objectives accordingly.
To develop my knowledge, I enrolled in two online courses and purposely chose them to be short so that I could gain the basic knowledge and then move on to working on my project to continue learning.

• Course 1 focused on the theory and fundamentals of React, JS and CSS etc
• Course 2 focused on applying these concepts by creating simple web applications

During these courses, make sure to take some notes as this will strengthen your understanding and can also be referred to at a later stage.

Every time we learn something new, the neural pathways in our brain get re-wired. However, this change is only temporary unless you repeat the process. Therefore, don’t skip and REVIEW your notes now!

Step 3

Creating a Project Blueprint

It is now time to brainstorm ideas for your project. In the past, I have usually built two kinds of projects(there could be more though 🤷‍);

• Project 1: Solve a new problem or add to an already existing one
• Project 2: Recreate something existing but adding your twist and experimentation to it

Although Project 1 provides with a higher intrinsic motivation, it can sometimes be tricky to think/find such a project. This was in my case, and so I decided to create an application following the principles of Project 2. Although my project wasn’t solving a problem, it still allowed me to learn about web development.

The next step is thinking of the project in detail.

Deciding Project Features
Features define the scope of a project i.e. things that a project should/shouldn’t do. For example, the following were the features of my web application;

• Feature 1: The user shall submit a form and this information shall then be used to pull data from an API and display this to the user
• Feature 2: Based on user selection, the app shall pull JSON dataset from an API and then display this as a Table such that each row is an object and the columns are the features associated with those objects. The app shall also display detailed information when an object is clicked
• Basic: The app shall embed components such as images, videos and GIFs etc

Designing Features
Seeing your goal visually is a great way to keep yourself motivated! Therefore, on a piece of paper, draw out what your project would look like based on the features described above. This could be UI design, Systems design, or both. These designs will help understand, where and how the above features would be accessed by a user. Also, creating flow diagrams that map end-to-end data flow will provide better insight into user journeys. Going through such a process will ensure that principles of accessibility, security, and maintainability are followed.

Step 4

Seeking Feedback

It is very easy to get lost in your train of thought when you are immersed in a project. Therefore,

• Take a step back and reflect on your progress
• Seek feedback from someone who is more knowledgeable in the field of your project, maybe your mentor

For example, I discussed the following with one of my colleagues;

• Project scope and requirements such as Feature 1 and 2
• UI design and data flow diagram
• Systems Design architecture

Step 5

Programming Features

By this stage, your project will be mature enough that you can finally get into the thick of things. Start programming your First Feature! Following are my tips;
It's important to program “thoughtfully” to not lose track of the goal

• Create MVP: With each Feature work, I focused on creating an MVP to see the application in action and then refactoring the code. This allows you to fail fast and make incremental progress towards the Feature
• Write Stuff: Write down any information/challenge, from technical to design on paper. This allows you to better process the facts, strengthen your understanding and produce a robust solution when problem-solving
• Scope Creep: Although a negative connotation, this can be useful where the goal is to experiment and learn. In my application, I added some features outside my initial scope to learn new concepts. However, it is still important to strike a good balance between explore/exploit to ensure that you are moving in the overall right direction

Seeking Feedback (Once more!)
After programming a feature, it is a good practice to review, reflect, and refactor your code (if required). This helps to identify any improvements earlier in the process, thus saving time and effort.

For my application, I raised a PR per feature and gave a walk-through to my colleague, who then provided me with some great feedback. This was an essential step in my learning as these discussions solidified my web development fundamentals.

Step 6

Wrapping Up: Documentation

Documentation is important both for reflecting on your work and helping others to understand and use your work. You should move to this step once you have completed programming all your feature work and met your objectives. Things that I did;

• Tidy and refactor the code and review the system architecture
• Explain the why and how to use the application, in the README
• Write a blog to share knowledge and inspire others

Wrapping Up: Celebrate 😃

It is important to acknowledge your hard work and determination to get this far. Therefore, ensure that you celebrate this feat and take a break in this journey. Doing so will clear your mind, thus providing space for new ideas to come. You can either stop here or progress to stretch objectives.
Work hard Play hard 💃

Step 7

Stretching Yourself

Before diving into your stretch objectives, ensure that your code has met ALL the basic objectives. For my application, I decided to stretch and develop my DevOps knowledge. Therefore, I;

• Created and published Docker images for both front and back end
• Hosted the full stack on AWS using Lambda, S3, CloudFront, Route 53 etc

Key Takeaways

This diagram summarises my approach to learning a new skill

• “You don’t have to be great to start, but you have to start to be great” — Zig Ziglar. It can be daunting to learn a new skill and therefore breaking it down into smaller achievable goals helps in tacking such a challenge
• Sometimes it can be hard to find a project that meets a need or fills a gap. In such cases, it’s okay to re-create someone else’s work or something similar to the above project as both will help you in learning a new skill

• Feedback is an extensive part of this process. Having frequent and in-depth discussions will exponentiate your learning. You can also use this to identify any future improvements or features

  Links: GitHub Repository Frontend, GitHub Repository Backend