
- Typescript – too reduce bugs
- Tailwind CSS – styling for the site/application
- HeroIcons – is a tailwind css icons library and will work great for the site
- Stepzen – powered the entire site will also allow the introduction of graphql
- MediaStack API – api sed for the live news on the site
- Nextjs 13 – as the server component for the site
- Reactjs – language struture for typescriptjs
- Dynamic Data – This is where is built at build time
- Static Data – This where every request we go and generate the information we can also revalidation techniques in nextjs 13
- Dark Mode (for eye sensitivity)
- Light Mode (default)
- Heroicons – when using reactjs user should run the following command in the terminal
npm add @heroicons/react
This example shows how to use Tailwind CSS (v3.2) with Next.js. It follows the steps outlined in the official Tailwind docs.
Deploy the example using Vercel or preview live with StackBlitz
Execute create-next-app
with npm, Yarn, or pnpm to bootstrap the example:
npx create-next-app --example with-tailwindcss with-tailwindcss-app
yarn create next-app --example with-tailwindcss with-tailwindcss-app
pnpm create next-app --example with-tailwindcss with-tailwindcss-app
Deploy it to the cloud with Vercel (Documentation).

Leave a Reply