Styling and building a sleek user interface or UI is a fundamental process in front-end development. One of the fast, high-performance and easy-to-use styling libraries is the styled-components.

Typescript is an awesome programming language built on javascript, although much code might be written for a similar task in javascript the advantages worths it.

Type Checking

Typescript is a strictly typed language and just like Java, C++, C#, etc she ensures you set a type for every variable, function, and function argument.

let num: number = 12;
const myFunc = (name: string):string => name + 'john';

This is a basic rule of Typescript and you can read more about it from her  docs

Create React App

We will begin firstly by creating a typescript-enabled react app, if you already have one you can skip this step.

Open your terminal and run the below command

npx create-react-app my-app --template typescript

## or
yarn create react-app my-app --template typescript

#styled-components #javascript-development #css #typescript

Using styled-components and Props With Typescript React
1.75 GEEK