DEV Community: YulyGP

21 React YouTube Channels you should Follow

YulyGP — Tue, 26 Jan 2021 23:49:30 +0000

It’s not necessary to know all the answers, but the channel of who may have it.

As a child, I believed that older people knew all the answers in the world. So you can imagine my frustration when my questions were landing with an IDK answer from my parents or another family member. But one day, my dad gave me a piece of advice I will never forget: You don’t have to know everything. Just have the phone number of those who may have the answers. And gave me the phone number of a library.

I’m recalling this now when a new year is barely starting and I’ve been finding tons of comments about people beginning the journey with a new programming language.

For those that are trying to keep up with React and Javascript and feeling exhausted, please don’t throw it the towel. Grab a cup of coffee (or tea, or a beer — I'm not judging), follow these 21 “phone numbers” (YouTube channels, you know what I mean), and play some videos. You will find what you’re looking for — from inspiration to education. Mastering is about persistence, patience, and have access to the right information. Just keep going!

Fun Fun Function: https://www.youtube.com/c/funfunfunction/featured
Wes Bos: https://www.youtube.com/user/wesbos/featured
FreeCodeCamp: https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ
Traversy Media: https://www.youtube.com/user/TechGuyWeb
Academind: https://www.youtube.com/channel/UCSJbGtTlrDami-tDGPUV9-w
The Net Ninja: https://www.youtube.com/channel/UCW5YeuERMmlnqo4oq8vwUpg
Techsith: https://www.youtube.com/user/techSithTube/featured
Pusher: https://www.youtube.com/user/pusherapp/about
The Coding Train: https://www.youtube.com/user/shiffman/featured
Hitesh Choudhary: https://www.youtube.com/user/hiteshitube/featured
LearnCode.academy: http://www.youtube.com/user/learncodeacademy
Dev Coffee: https://www.youtube.com/channel/UCqr-7GDVTsdNBCeufvERYuw
ReactCasts: https://www.youtube.com/channel/UCZkjWyyLvzWeoVWEpRemrDQ
Facebook Developers: https://www.youtube.com/user/FacebookDevelopers
Rally Coding: https://www.youtube.com/channel/UCQCaS3atWyNHEy5PkDXdpNg
Rem Zolotykh: https://www.youtube.com/user/MrRemchi
Codevolution: https://www.youtube.com/c/Codevolution
Ben Awad: https://www.youtube.com/user/99baddawg
Kent C. Dodds: https://www.youtube.com/channel/UCz-BYvuntVRt_VpfR6FKXJw
Programming with Mosh: https://www.youtube.com/user/programmingwithmosh
NodersJS: https://www.youtube.com/channel/UC7tUsO3S7424TMcgSCUOCow/

Hope this will help you. Thanks for reading!

How to make a HOW-TO guide in a few steps

YulyGP — Tue, 26 Jan 2021 23:06:33 +0000

There are tons of great guides, tutorials, and how-to videos out there. So how do you make yours stand out? It seems difficult but not impossible. Take a look at this guide for making a HOW-TO that’ll attract readers and make them want to share your content.

STEP 1. Planning

Pick a topic to write about: Think about a problem you can fix or something you are interested in. Pick a topic that hasn’t been written about too often. Do your homework, do research.
Think about your target audience: Before starting your HOW-TO you should have a specific audience in mind. According to the audience, you can determine the level of detail you’ll need to create it.
Research about the process: Find out how other people do what you want to do. Look online for existing tutorials about the topic and annotate all the steps you think you’ll need. Don’t forget to take notes of all the positive, cool things you notice so you can implement them into your own creation.
Gather the materials you need: For your tutorial, you’ll need to collect all the material and information that you want to include. For example, pictures, code snippets, graphs, links to other resources, etc.

STEP 2. Building it

Create a great title and add an interesting image: Grabbing readers’ attention in the first few seconds is key. Choose a title that clearly describes what the tutorial is about and an attractive image to complement it.
Begin with an Introduction: Introduce the topic in a simple way so your audience clearly understands what you’re talking about, and why this topic will be useful.
Include a list of supplies, tools and/or resources: Before you start to describe the process, you may want to list what the person will need to accomplish the task. Inform your audience about any required knowledge, configuration, or useful resources.
Write instructions in chronological order: Follow a step-by-step approach, keeping in mind the logical sequence of events. Describe each step as clearly and precisely as possible. Use images, code snippets, graphs, short videos to help your readers conceptualize the process.
Conclude with tips, advice, links to other resources: Lead your audience into other resources. Add tips, FAQs, references and all you think will help them to successfully make their task.

STEP 3. Posting

Check again what you create: Be sure to check carefully for spelling and grammar mistakes. It may be helpful to have someone else review it. Ask for feedback.
Test the guide yourself: Follow the step-by-step instructions you created. Look for an obvious step that you might have missed or a step out of order.
Publish your guide: Once you have all the feedback and corrections, it’s time to publish it. You may want to put it on your website, blog, and/or in a publishing platform like Medium, that fits your intended audience. Check that your writing meets any specified guidelines of the site.

Don’t forget to keep an eye on your post reactions and comments. Feedback is always welcome and will help you improve not only what you have done, but also your future work.

I hope you find this guide useful. Notice you can also use it to create a tutorial video. Do you have a great HOW-TO tutorial you’d like to share? Post it in the comments below, and I’ll give you my opinion.

11 Best Websites to Announce Software Products

YulyGP — Tue, 22 Dec 2020 17:07:27 +0000

2020 is coming to an end (Finally!), and I know you are waiting for the right moment to announce that idea you’ve been working on these last months. The start of a new year fits you like a glove. But where?

Internet could be overwhelming sometimes. There are many places to keep up to date and learn from people who are in the same field: LinkedIn, Facebook, Twitter, TikTok (why not?), YouTube, etc. For example, if you’re immersed in the tech environment, working in a SaaS (Software as a Service) company, or even learning a framework like React, YouTube is a good ally. But back to business, what you need is a list of the best websites to announce your software product for the first time. So here you have these 11 websites we’ve compiled for you, hoping these will help you put your ideas into the market and beyond:

Reddit- Entrepreneur: https://www.reddit.com/r/Entrepreneur/
Reddit-SideProject: https://www.reddit.com/r/SideProject/
Hacker News: https://news.ycombinator.com/
Product Hunt: https://www.producthunt.com/
Betalist: https://betalist.com/
AngelList: https://angel.co/
Beta Bound: https://www.betabound.com/
BetaTesting: https://betatesting.com/
Feed My App: http://uk.feedmyapp.com/
Index.co: https://index.co/
Launching Next: https://www.launchingnext.com/

In case you don’t have a new software development project yet or are starting a new one right now, check out the benefits of doing it with a React component library.

Let me know your thoughts and which ones fit you. Good luck launching!

Should you build your own React component library?

YulyGP — Wed, 18 Nov 2020 17:37:17 +0000

4 Advantages of Using a React Component Library, Three Musketeers and a D’Artagnan

It seems that nowadays every software company is creating its own component libraries. Why? Well, technology companies around the world have realized the only way to scale their software solution is by building reusable components.

Most businesses have to develop multiple projects, and in doing so, usually need to follow the same design guidelines. By way of example, Google offers several products such as Gmail, Google Docs, Google Analytics, and several others. You’ll notice that these projects all have similar user interfaces, that’s because Google leverages their own component library to cut down on development time and provide a consistent experience for their users across their applications.

However, for smaller companies that lack the resources of Google, building a reusable UI component library can be timely and cost prohibitive. Big companies are developing component libraries because they can afford to have what is called “platform teams” that support other developers inside the company by building things like component libraries so they can build software faster.

So if you’re a small or medium-sized business or especially a new startup, you’ll likely not have the resources available to build your own component library. Fortunately, there are several reliable and open source component libraries that already exist and most importantly are free! By using an open source library, smaller companies are able to take full advantage of the benefits of utilizing a component library without worrying about the cost or time of building their own.

To better understand the advantages of using an open source library let’s take a look at some key benefits of using them.

Benefits

Ready To Use: a component library is a robust set of ready-made UI components such as badges, buttons, tables, and so on. With a simple import, the library is ready to be used. Often, you just have to copy and paste code snippets to make it work.
Time Efficient: you can mix and match the existing components to create your project so you can save time by not building everything from the beginning. It also reduces decision-making time from not having to design components APIs that work for all your use cases.
Developer Friendly: components are carefully designed, well-documented, and well-organized by professionals. This will help you easily understand what you need to do, and shorten development and maintenance time. Plus if you’re a developer with not much design knowledge, you can effortlessly create elegant layouts and provide a nice UX for your users.
Consistency: adopting a component library will give you a consistent UI and UX across your project. Meaning you don’t have to worry about your project having different designers working at the same time with inconsistent designs. Everything will remain uniform.

Not to mention, that since these libraries are open source they are free! Meaning no need to get buy in or invest in leveraging these libraries.

How to evaluate component libraries

Like any other tool, open-sourced component libraries aren’t perfect and it won’t suit every use case you may have.
Based on my own experience, most of the gaps in open source component libraries are related to customization, accessibility, and testing.

So you should consider the following while evaluating component libraries:

Does your project demand a lot of customization?
Are you working on a government project that requires by law accessibility compliance?
How well-tested are the components in the library you selected?

While you analyze your project’s needs be sure to check out these top 3 component libraries, plus one that has been getting noticed lately by the community.

Three Musketeers on the market… and D’Artagnan

If you decide that a component library is a good fit for your project, here are 3 of the most popular and useful React component libraries, frequently mentioned in tech blogs and platforms like medium.com and dev.to:

Material-UI
Ant Design
Semantic UI

These libraries have a good reputation in the community and will help you build your React project with a great UI. They have tons of stars on GitHub, a bunch of high-quality components out of the box, flexibility in customizing components, as well as some other great features. They’re big, they’re good, and have been in the market for some time, but what about D’Artagnan?

I strongly believe that we have to make room for new things, like when the old trio of musketeers accepted a new member in the iconic Alexandre Dumas’ novel. I believe, in this case, D’Artagnan is Rainbow UI.

Rainbow UI is an open source React component library designed for enterprise-level products. Its features include internationalization, accessibility, and most importantly, they eliminate frustrating breaking changes.

Rainbow UI offers over 90 components, which is more than Material, Semantic, and Ant Design. Providing you greater options and customization for your project.

Rainbow UI also includes several modules and interactive examples so you can build a better product, faster. With the modules and interactive examples, this allows you to be ahead of the game in comparison to traditional options like our Three Musketeers listed above.

For all my latest projects, we’ve used Rainbow UI and aren’t planning on switching back anytime soon. Ultimately, you can’t be wrong in any of the options listed above.

Tell us in the comment section below what’s important while you’re evaluating component libraries and which library you typically utilize.