Fun experiments to improve your JavaScript learning

There’s no end to learning — especially in web development. Our industry is constantly updating and improving itself, and so should we! Unfortunately, persistence can be exhausting, but it doesn’t have to be. In this article I’ll show you how to turn small experiments into a fun and effective way to learn something new and ensure you have fun learning and staying current.

Keep experimenting fun

Do you do side projects? If you do, I'm sure you've worked on a project that started out as a lot of fun, but quickly turned into a mess. Getting stuck is not fun and can do a lot of damage to both parties' projects and your work. The main reason is often scope creep or stress, and you should be relaxing in your spare time. By enforcing a few rules, we can ensure that we don't encounter unpleasant surprises:

1.Get your work ready . Make sure you know how big your experiment is and what it includes. If it's too much, break it into manageable chunks, each chunk having a beginning and an end, or terminate it.

2.Scheduled tasks. Don't stay up late every night. Just schedule an hour or two, once or twice a week.

3.No deadline. Everyone, including you, needs to relax. It’s good to set goals and it’s okay not to accomplish them.

4.Give yourself some fun time. While you shouldn’t procrastinate, life is more than just checking boxes off a to-do list. Take the time to enjoy the fruits of your labor.

# Doing small experiments doesn’t mean they can’t be part of a larger project. Take a data visualization project as an example. It will take some time to complete, but it can be easily divided into small tasks:

●Set up a build workflow

●Get interesting Data (this is a list of APIs to inspire you)

●Get and process data with Node.js, taking advantage of ES2015 features

●Compare and choose a technology (canvas, WebGL , DOM/SVG) or libraries (d3.js, p5.js, THREE.js) Visualize data

●Visualize data with the tool of your choice

I use Trello templates to track all my experiment of. There I list them and plan for them, adding relevant information until the experiment starts. For larger projects, I tend to create new templates for it and add cards for each task. Other alternative tools may also meet the needs. Documenting things eliminates distractions.

Reviewing Experiments

In addition to learning by actually doing new things, experiments are also Great opportunity to improve yourself. Look back at your experiment and ask yourself the following questions:

1. Could problems during execution have been avoided through better preparation? If so, how would you have done that?

2. What is the quality of the work performed and what can I do to improve it?

3. Can I prepare my experiments more effectively?

Reviewing and improving what we do provides us with Gain experience – which is also very valuable to our industry. Many experimental reviews make for a good blog post.

Running environment

You probably already know that JavaScript works in the browser, but did you know that you can also run JavaScript programs outside the browser? ?

●Node.js is by far the most popular JavaScript that does not require a browser to run. With it, you can write scripts, command line interfaces, desktop applications, or other things. It runs on Windows, OS X and Linux.

●Electron allows you to build cross-platform desktop applications using old-school HTML, CSS, and JavaScript.

●Cordova allows you to build mobile software using HTML, CSS, and JavaScript.

●React Native allows you to build mobile software using the React framework.

Browser API

Over the past few years, many new APIs have been introduced into browsers that allow you to do all kinds of interesting things things.

●Service Worker API is a larger API that allows us to do various things, such as providing offline support.

●WebRTC is an API that allows us to create a real-time connection to another computer

There are some APIs that allow us to use device connections to do things like read sensor data or Make the device do something (like vibrate).

●Ambient Light Sensor provides ambient brightness information for us to use to adjust the brightness of the website or application.

●The function of Battery Status is clear at a glance. We can ask for battery status. Programs that consume a lot of power can use it to enable power saving mode.

●Geolocation provides us with information about the user’s location.

●We can use network information to provide customers with smaller files.

●Notifications are very useful for many applications, such as chat applications.

●Are you building a game that uses mouse input, using Pointer Lock is what you need.

●Proximity allows you to understand how closely the user and device are connected. Maybe this could be used to detect "hugs"?

●Device Orientation allows us to detect when an orientation change occurs.

●Vibration allows us to vibrate the device, which is great in games.

Libraries and Frameworks

Most libraries are designed to make work easier , so it doesn't require a lot of experience to use it. Many popular libraries and frameworks (such as Angular and Reacti) are even considered essential knowledge systems for careers. One or two types of reserves can better help you express yourself in interviews.

After understanding that libraries and frameworks can continue to evolve for so long. Although they are helpful, you should understand the problems that frameworks and libraries solve and be able to solve them without the help of these libraries and frameworks.

Framework structure

●Angular is an MVC framework that is still used by many teams.

●React is a library for rendering views.

●Polymer is a library for creating web components.

●Lodash.js, Underscore.js and Ramda.js are all functional programming libraries. Some teams like to use them, but many don't. Either way, understanding functional programming is a good development skill and you should check out these frameworks.

real world

Personally, when I find out that I can do something in the real world by writing software, I really get excited. Very excited. Consider any of the following:

●The Raspberry Pi is a credit card-sized single-board computer ideal for teaching or learning.

●Arduino is similar to Raspberry Pi, but focuses more on the electronic side of things.

●LEGO® MINDSTORMS® is a mini computer that can control LEGO hardware. Why not choose it?

●Johhny-FiveJohhny-Five is a JavaScript framework for robotics and IoT that can be installed on an Arduino or similar device.

All of the above minicomputers are programmable and can be developed through JavaScript.

Conclusion

Small experiments are a great way to learn new things hands-on. Another benefit is that small experiments can help you improve the way you work and what is most valuable in your industry. By enforcing a few rules, we can keep experimenting fun and motivate ourselves to learn more and become better.

For those of you who are stuck, I hope this article has given you the motivation to start a new and interesting experiment. For those of you who are not sure what to tackle next, I hope this article has given you some inspiration. If you are interested in any term in the article, you are welcome to search for its more detailed content and discover a larger world.