# Frontend Development

### Typescript:

Typescript is a subset of javascript initially developed by microsoft to introduce a type system and plethora of static checking capabilities to the standard javascript toolchain. Typescript reduces potential for runtime errors, improves code readability and testing requirements.

Typescript + React Tutorials: 

{% embed url="<https://handsonreact.com/docs/labs/react-tutorial-typescript>" %}

### Tailwind CSS

Tailwind css are like building blocks for web designers to create their UI. The most popular being <https://tailwindui.com/components> that show the tailwind styles can be composed to create beautiful looking UI and layouts. Also [preline tailwind](https://www.google.com/search?client=safari\&rls=en\&q=preline+tailwind\&ie=UTF-8\&oe=UTF-8) is Tailwind based set of components that we are using.

Wisdom to absorb:

{% embed url="<https://www.youtube.com/tailwindlabs>" %}

Tutorials:

{% embed url="<https://github.com/epicweb-dev/pixel-perfect-tailwind>" %}

Playground:&#x20;

{% embed url="<https://play.tailwindcss.com/>" %}

### Next.js

Next.js is one of the popular web frameworks for using react, it supports both client side and server side rendering and can support a wide range of use cases and simplifies the routing routing logic. We use Next.js as our primary web framework for the client side react code.

Tutorial:

{% embed url="<https://www.youtube.com/watch?v=pUNSHPyVryU>" %}