We’ll use react-native to make a todo list app using typescript, zustand, shopify-restyle hop over to the video tutorials Setting up boilerplate using expo npx create-expo-app --template Folder structure

Concepts to be covered Spacing in tailwind 1. Padding 2. Margin Font classes

The tailwind classes that play a major role in styling the form are. 1. For proper spacing ( margin ) between the child elements of a parent container we can use space-y-[value] for instance space-y-4  2. For animation on buttons 

Let’s break the whole Application in two parts 1. Styling 2. Functionalities The tailwind classes that play a major role in styling the form are. 1 .For proper spacing ( margin ) between the child elements of a parent container we can use space-y-[value] for instance space-y-4

To get the of material-ui let’s try to make 10 different types of cards Basic Card import React from "react"; import { makeStyles } from "@material-ui/core/"; import { Card, CardContent, Typography } from "@material-ui/core/"; const useStyles = makeStyles({ root: { minWidth: 275, backgroundColor: "rgba(255,255,255,0.4)", backgroundImage: "linear-gradient(45deg, #ff9a9e 0%, #fad0c4 99%, #fad0c4 100%)", backdropFilter: "blur(40)px", boxShadow: "10px 10px 10px rgba(30,30,30,.1)", borderRadius: 10 } });