Tweet

Kingsley Ubah

8 Jun, 18 tweets, 5 min read

15+ Fantastic React UI libraries to consider for your project

🧵

🔹 Blueprint

Blueprint is a React UI toolkit used to create and manage data-intensive user Interfaces for desktop applications

github.com/palantir/bluep…

🔹Chakra UI

Chakra UI contains a set of cool, flexible React components that work out of the box. All components are dark mode compatible.

github.com/chakra-ui/chak…

🔹Search UI

Search UI is a React-based search framework for implementing world-class search UI experiences without reinventing the wheel.

github.com/elastic/search…

🔹Ant Design

This is an enterprise-grade React UI framework containing a set of tools for creating beautiful UIs

github.com/ant-design/ant…

🔹 Material UI

React components for faster and easier web development. Build your own design system, or start with Material Design.

github.com/mui-org/materi…

🔹Reactstrap

Stateless React components for Bootstrap 4

github.com/reactstrap/rea…

🔹Smooth UI

As it's name implies, It is focused on developer experience and accessibility. With Smooth UI, it is easy to design beautiful websites and applications.

smooth-ui.smooth-code.com

🔹React DatePicker

A simple and reusable React DatePicker Component

reactdatepicker.com

🔹React Select

A beautiful set of select input control with multiselect, autocomplete and other nice features

react-select.com/home

🔹Sortable-hoc

A set of React components to make lists into an animated, sortable list.

github.com/clauderic/reac…

🔹Rc-calendar

A modular toolkit to build calendar-related things in React.

github.com/react-componen…

🔹React-toggle

An elegant, accessible toggle component for React. Also a glorified checkbox.

aaronshaf.github.io/react-toggle/

🔹Wysiwyg

A multifeature text editor build on top of ReactJS and DraftJS.

github.com/jpuri/react-dr…

🔹Victory

A collection of composable React components for building interactive data visualizations .

🔹Halogen

A collection of loading spinners with React.js.

github.com/yuanyan/halogen

🔹Dragula

Drag and drop React Component that's very simple to use

bevacqua.github.io/react-dragula/

Struggling to grasp some topic or concept in web development?

Check out this well-written beginners guide on web development with tutorials which cover HTML, CSS, JavaScript and other fundamentals

gumroad.com/a/834147443

• • •

Missing some Tweet in this thread? You can try to force a refresh

This Thread may be Removed Anytime!

Twitter may remove this content at anytime! Save it as PDF for later use!

More from @UbahTheBuilder

Kingsley Ubah

@UbahTheBuilder

10 Jun

21 GitHub Repositories For Web Developers

//THREAD//

JavaScript Algorithm and Data Structures
github.com/trekhleb/javas…

AirBnB JavaScript guide
github.com/airbnb/javascr…

Useful Resources for Front-end devs
github.com/RitikPatni/Fro…

HTML 5 Boilerplate
github.com/h5bp/html5-boi…

Daily Interview Question
github.com/Advanced-Front…

Developer Roadmap
github.com/kamranahmedse/…

List of free learning resources
github.com/EbookFoundatio…

Front-End Checklist
github.com/thedaviddias/F…

Free-for. dev
github.com/ripienaar/free…

CSS Tips
github.com/AllThingsSmitt…

Big List of naughty strings
github.com/minimaxir/big-…

Read 7 tweets

Kingsley Ubah

@UbahTheBuilder

1 Jun

10 Amazing Chrome Extensions for Web Developers

🧵

🔹 Check My Links

Check My Links is a link checker that crawls through your website and looks for broken links and is useful for websites with lots of links. You can copy all bad links with one click.

chrome.google.com/webstore/detai…

🔹Daily dev
Daily .dev is chrome extension which helps you stay up-to-date in the programming world. It’s a news aggregator just for software developers that takes its input from hundreds of news sources on programming

chrome.google.com/webstore/detai…

Read 12 tweets

Kingsley Ubah

@UbahTheBuilder

30 May

4 simple strategies I use write code faster

🧵

🔹Relative Comparison

This is a strategy I use to remember syntax. I simply reason about one language/syntax in relation to another.

For eg,JavaScript uses semicolons and bracket parameters whereas Python uses no brackets, as well as indentation

By relating them, I remember.

🔹Cleansheets

I have so many cleansheets saved in my computer. Cleansheets for Git commands, CSS selector syntax, JavaScript, Flexbox and CSS grids, Bootstrap classes etc are all saved on my computer.

When I get stuck, I just refer to them easily and quickly.

Read 5 tweets

Kingsley Ubah

@UbahTheBuilder

28 May

How to become a full-stack web developer in 2021

🧵

🔹Learn HTML

HTML is the markup language of the web. With it, you can make texts underlined, bold, italicized etc.

You can also create navigations, forms and many more web elements.

Learn about HTML here 👇

w3schools.com/html/

@traversymedia

🔹Learn CSS

CSS (Cascading Style Sheets) is used to style/design HTML elements. Without CSS, the whole web page would look boring. CSS can also be used to create simple, yet eye-catching animations.

Learn more about CSS with (@traversymedia)

Read 14 tweets

Kingsley Ubah

@UbahTheBuilder

27 May

What exactly is Local Storage and how is it used?

Here's all you need to know:

The local storage is a mechanism used to store information about a user like his/her

- name
- interests
- preferences

or even cookie in the client's computer.

It is a small database controlled by the web browser

- You can only store the values as strings, not array or object

- If the information you want to store in local storage is an array, object or map, you must first coerce it to a string.

- Info will remain even after the tab is closed.

Read 9 tweets

Kingsley Ubah

@UbahTheBuilder

26 May

7 essential skills every web developer should have (my opinion)

🧵

🔹 Problem Solving

I put this first because I think it's the most essential soft skill to posses

Whether you are planning your site's design, styling elements or debugging, you are solving a problem

Web devt and programming is all about problem solving and critical thinking.

🔹 Communication

Not everyone knows what the DOM, Git or an API is

Being able to communicate difficult concepts in a simple and digestible way is a crucial skill, especially for teamwork and collaboration

Mastering the art of effective communication is crucial for a web dev

Read 9 tweets

Support us! We are indie developers!

This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3/month or $30/year) and get exclusive features!

Become Premium

Too expensive? Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal Become our Patreon

Thank you for your support!