Learn with Param{ P }

BlogVideos
#react
#css
#javascript
#tech talks

Styled components using emotion in React - Badge component - Styling in React

October 05, 2019 β€’ 🍿 12 min watch

Lets learn to create a styled component in React using Emotion library. We will create a Badge component and style it using emotion

Continue watching β†’

Learn how to handle nested routes and nested content using react router

October 03, 2019 β€’ 🍿 6 min read

Most of the SaaS single page applications have nested routes. We will see how to build nested routes in a react application using react router library

Continue reading β†’

Styling a React component using CSS Modules - Card Component

September 26, 2019 β€’ 🍿 4 min watch

Lets learn to re-write styles using CSS Modules for our card component. Also learn how CSS Modules work and helpful for styling react components.

Continue watching β†’

Styling a React component using CSS - Card Component

September 25, 2019 β€’ 🍿 7 min watch

Lets learn to create a card component in React and style it using plain old CSS

Continue watching β†’

Managing error and loading state using useReducer

September 14, 2019 β€’ 🍿🍿 18 min watch

In this tutorial, we will learn when to use useState and when to use useReducer. Also how to manage error and loading state while fetching an API using useEffect.

Continue watching β†’

Fetch API data in React using useEffect hooks

September 10, 2019 β€’ 🍿 7 min watch

Lets learn to fetch countries REST API using react useEffect and browser fetch API.

Continue watching β†’

React useState example by building a text-size changer

September 09, 2019 β€’ 🍿 5 min watch

In this example, we learn to use React useState hooks to change font size of a content block

Continue watching β†’

Styling a react app using Emotion CSS in JS library - An introduction to Emotion

August 16, 2019 β€’ 🍿🍿 8 min read

How to style your react app using emotion library. It has several ways to style the app. We will learn how to create global styles, styled components and CSS in JS through set of emotion libraries.

Continue reading β†’

How to sync props to state properly in React Hooks

August 02, 2019 β€’ 🍿 2 min read

It is easy to pass props to state in react hooks, but do you know how to sync props changes to state changes after initialization. It is also easy, lets see that in this article.

Continue reading β†’

Redirect routes in react router

July 25, 2019 β€’ 🍿 3 min read

Redirecting a page based on some condition is an usual need in a react web application. React router provides an easy way to achieve it. Lets learn how to do that in this article.

Continue reading β†’

How to pass props to the route component in React router

June 17, 2019 β€’ 🍿 2 min read

We have seen several examples and use cases in react router. One among them is passing props to the route component directly. Lets learn how to do it.

Continue reading β†’

Hooked with React - Using react router in our react application to route a dynamic page

June 12, 2019 β€’ 🍿 6 min read

Creating book details page using react router in our book search application - Part 4

Continue reading β†’

React as templates for your server side applications

May 16, 2019 β€’ 🍿 2 min read

React has been used in desktop, mobile, web and VR development. In this article, we will see how it can be used in server side applications as templates.

Continue reading β†’

Creating 404 page in react using React Router

May 08, 2019 β€’ 🍿 2 min read

Learn how to show a 404 page in a client side routed react application if there is no route matching the URL

Continue reading β†’

Maintaining centralized documentation using Docusaurus

May 12, 2019 β€’ 🍿 1 min read

Documentation is always a headache for engineering teams. Once engineering teams start growing, its very difficult to on-board engineers. Docusaurus was a react based documentation tool created by facebook to centralize your documentation.

Continue reading β†’

Hooked with React - Refactor the react application and separate components into separate files

April 25, 2019 β€’ 🍿 3 min read

Learn how to split the react app into components and talk about folder structures briefly, Part 3

Continue reading β†’

How to handle query params in React Router

April 22, 2019 β€’ 🍿 3 min read

Learn how to handle query params in a client side react application using react router library

Continue reading β†’

Hooked with React - Error handling and loading state in react hooks

April 18, 2019 β€’ 🍿 4 min read

Learn how to handle errors and loading state in react hooks through our book search app - Part 2

Continue reading β†’

Dynamic pages in react router

April 15, 2019 β€’ 🍿 4 min read

Learn how to create dynamic URLs in react application using react router package

Continue reading β†’

Hooked with React - Learn by building a book search app using react and its siblings

April 14, 2019 β€’ 🍿 4 min read

Lets build a simple books search page using google books API in react. While developing it, we will explore react hooks, css modules and testing in react application - Part 1

Continue reading β†’

Different types of routers in react router

April 12, 2019 β€’ 🍿 2 min read

There are several types of router supported by react router package. We will see the use cases for each types briefly in this article.

Continue reading β†’

Basic routing in React using React Router

April 10, 2019 β€’ 🍿 4 min read

Learn how to do routing in React applications using React router library. React is widely used library for client side web applications. In any web applications, there will be multiple pages. Routing the URL properly and load different pages based on route parameters is a general requirement.

Continue reading β†’

First hand experience with Gatsby, Contentful and Netlify

March 08, 2019 β€’ 🍿 2 min read

My experience on working with a demo project using Gatsby, Contentful and Netlify. It is opinionated and not through with a production level project.

Continue reading β†’

Subscribe to my Newsletter

I share best news, articles and projects about JavaScript, React, GraphQL and real world development practices

Made with ❀️ in Tallinn, Estonia

Paramanantham Harrison's DEV Profile