Build and deploy a digital identity app with Next.js, Tailwind CSS, TypeScript and Solidity

Channel	Publish Date	Thumbnail & View Count	Download Video
	Publish Date not found	0 Views	View on YouTube Download Video

Built using the latest versions of Next.js, TypeScript, and Solidity, IdentiFi is a decentralized application that helps people create their DID on the blockchain. The current digital identity landscape is often fragmented and insecure, making it difficult for users to manage and verify their identities across different platforms. IdentiFi was inspired by the potential of blockchain technology to create a unified, secure, and verifiable digital identity solution that allows users to seamlessly manage their identities.

Shadcn: https://ui.shadcn.com/
Neon: https://console.neon.tech/
TailwindCSS: https://tailwindcss.com/
Pinata Cloud: https://www.pinata.cloud/
Solidity: https://soliditylang.org/
Chainlist: https://chainlist.org/?searchbtt&testnetstrue
BTTC testnet: https://testfaucet.bt.io/
Metamask: https://metamask.io/
Hardhat: https://hardhat.org/hardhat-runner/docs/getting-started#quick-start

Materials/References:
GitHub repo (starred): https://github.com/mendsalbert/identiFi
README (assets and code): https://github.com/mendsalbert/identiFi
Starter code: https://github.com/mendsalbert/identiFi-starter-file
️ BuyMeACoffe: https://www.buymeacoffee.com/mendalbert

Social Media:
https://twitter.com/mendsalbert
https://www.instagram.com/mendsalbert_
https://linkedin.com/in/mends-albert
https://t.me/albertmends

Subscribe or I'll switch your VS Code to light mode

time stamp
00:00:00 – Introduction
00:00:42 – Demo
00:03:13 – Clone starter files
00:04:25 – Installing npm packages
00:05:00 – Explore starter files
00:06:29 – Create layout page
00:07:05 – Setting up secret authentication
00:12:48 – Secret API key
00:13:06 – Setting up the chain for the abortion
00:14:32 – Chainlist: Select chain
00:16:04 – Install MetaMask wallet
00:16:47 – Add chain to MetaMask wallet
00:17:58 – Set up the chain in Privy and complete the layout page
00:22:53 – Changing the login priority in the Privy Dashboard
00:23:51 – Landing page (part 1)
00:25:16 – Fix errors (landing page layout page) and test
00:26:05 – Installing a safety helmet
00:26:56 – Initialize Hardhat (bug fixes)
00:29:50 – Setting up the hardhat.config.js file
00:36:45 – Writing Smart Contracts (Structures)
00:47:32 – Writing a smart contract (assigning variables)
00:50:03 – Writing a Smart Contract (Modifier)
00:52:56 – Writing a Smart Contract (creating and editing a UserInfo function)
00:58:52 – Writing a smart contract (function getUserByUsername)
01:03:09 – Complete Smart Contract
01:07:15 – Test for Smart Contract
01:08:11 – Deployment script
01:10:28 – BTTC testnet token received
01:11:53 – Deploy Smart Contract
01:14:37 – Utils and Lib directory (writing queries to interact with the smart contract functions in the frontend)
01:36:15 – Landing page (navigation bar)
02:12:48 – Landing page (hero area)
02:28:48 – Target page (section)
02:42:33 – Onboard page
02:58:50 – Setting up Pinata to store images on IPFS
03:01:42 – Passing the user identity to the chain function
03:03:09 – User profile display component
03:13:17 – Form fields and social media inputs
03:15:40 – Completing and testing the onboard page
03:25:36 – Dashboard page
03:37:45 – Confirm Identity Page
03:44:50 – Deploying to Netlify