https://github.com/pasan-pahasara/react-learning

This Project is introduced to learning React, TypeScript and Tailwind CSS.
https://github.com/pasan-pahasara/react-learning

react tailwind-css typrescript

Last synced: 3 months ago
JSON representation

This Project is introduced to learning React, TypeScript and Tailwind CSS.

• Host: GitHub
• URL: https://github.com/pasan-pahasara/react-learning
• Owner: Pasan-Pahasara
• License: gpl-3.0
• Created: 2023-03-05T10:15:28.000Z (over 3 years ago)
• Default Branch: master
• Last Pushed: 2023-09-21T09:07:00.000Z (almost 3 years ago)
• Last Synced: 2025-09-21T07:26:28.301Z (10 months ago)
• Topics: react, tailwind-css, typrescript
• Language: TypeScript
• Homepage:
• Size: 946 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: License

Awesome Lists containing this project

README

          
##

# Getting Started with Create React App

This Project is introduced to FrontEnd Using React, TypeScript and Tailwind CSS

###  `FrontEnd`

* React

* TypeScript

* Tailwind CSS

##

## **Create new index.ts**

- **`Intall type script`**

```

npm install -g typescript

```

- **`Fix the error`**

```

Set-ExecutionPolicy RemoteSigned -Scope CurrentUser

```

- **`Run typeScript file`**

```

tsc index.ts

```

- **`Run javaScript file`**

```

node index.js

```

- **`Init project file`**

```

tsc --init

```

- **`Refactor project and run`**

```

tsc

```

## React Application

- **`Install React`**

```

npx create-react-app test-app --template typescript

```

- **`Install Tailwind css and other libarary`**

```

npm install -D tailwindcss postcss autoprefixer

```

- **`Create Config File tailwindcss`**

```

npx tailwindcss init -p

```

- **`Config Tailwind CSS In VScode`**

```

Go to setting and search **Files assocition** set it `Item`:`*.css` `Value`:`tailwindcss`

```

- **`Install React Router DOM`**

```

npm i react-router-dom

```

- **`Install Material Icons`**

```

npm install @mui/icons-material @mui/material @emotion/styled @emotion/react

```

- **`Install Material UI`**

```

npm install @mui/material @emotion/react @emotion/styled

```

##

#

- **`Not Detected Node Modules`**

```

npm install

```

- **`Run Project`**

```

npm start

```

#  

#### Clone this repository ✅

```md

https://github.com/Pasan-Pahasara/React-Learning.git

```

###                                              

###### If you think my code is good pleace drop a Star 

![GitHub issues](https://img.shields.io/github/issues/Pasan-Pahasara/React-Learning?&labelColor=black&color=eb3b5a&label=Issues&logo=issues&logoColor=black&style=for-the-badge)

![GitHub Contributions](https://img.shields.io/github/contributors/Pasan-Pahasara/React-Learning?&labelColor=black&color=8854d0&style=for-the-badge)

### License 📝

[![GitHub license](https://img.shields.io/github/license/Pasan-Pahasara/React-Learning?&labelColor=black&color=3867d6&style=for-the-badge)](https://github.com/Pasan-Pahasara/REST-API/blob/main/License)



![repo size](https://img.shields.io/github/repo-size/Pasan-Pahasara/React-Learning?label=Repo%20Size&style=for-the-badge&labelColor=black&color=20bf6b)

 

![GitHub forks](https://img.shields.io/github/forks/Pasan-Pahasara/React-Learning?&labelColor=black&color=0fb9b1&style=for-the-badge)

![GitHub stars](https://img.shields.io/github/stars/Pasan-Pahasara/React-Learning?&labelColor=black&color=f7b731&style=for-the-badge)

![GitHub LastCommit](https://img.shields.io/github/last-commit/Pasan-Pahasara/React-Learning?logo=github&labelColor=black&color=d1d8e0&style=for-the-badge)



 

If you have any questions or just wanna say hi, 
MAIL ME 

  

      

  

 

 


 

 

#### Developed by [Pasan Pahasara](https://github.com/Pasan-Pahasara/)