NiftySignal
NiftySignal is a tool that allows users to easily add NFTs from the list to their personal watchlist. Once an NFT is added to the watchlist, users can activate notification for events. This feature allows users to stay updated on their desired NFTs, making it easier for them to track.
Demo
https://nifty-signal.vercel.app/
How it works
Tech stack
- NextJS
- TailwindCSS
- Redis
- Helius
- Daisyui
- Zustand
- Lucide Icons
Next steps
- Notifications: SMS, email, Discord...
- Analytics
- Instant buy NFTs
Getting Started
This is a Next.js project bootstrapped with create-next-app
.
The responsive version for wallets and wallet adapter may not function or work as expected for mobile based on plugin and wallet compatibility.
Installation
npm install
# or
yarn install
Build and Run
Next, run the development server:
npm run dev
# or
yarn dev
Open http://localhost:3000 with your browser to see the result.
You can start editing the page by modifying pages/index.tsx
. The page auto-updates as you edit the file.
API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.ts
.
The pages/api
directory is mapped to /api/*
. Files in this directory are treated as API routes instead of React pages.
Features
Each Scaffold will contain at least the following features:
Wallet Integration with Auto Connec / Refresh
State Management
Components: One or more components demonstrating state management
Web3 Js: Examples of one or more uses of web3 js including a transaction with a connection provider
Sample navigation and page changing to demonstate state
Clean Simple Styling
Notifications (optional): Example of using a notification system
A Solana Components Repo will be released in the near future to house a common components library.
Structure
The scaffold project structure may vary based on the front end framework being utilized. The below is an example structure for the Next js Scaffold.
├── public : publically hosted files
├── src : primary code folders and files
│ ├── components : should house anything considered a resuable UI component
│ ├── contexts` : any context considered reusable and useuful to many compoennts that can be passed down through a component tree
│ ├── hooks` : any functions that let you 'hook' into react state or lifecycle features from function components
│ ├── models` : any data structure that may be reused throughout the project
│ ├── pages` : the pages that host meta data and the intended `View` for the page
│ ├── stores` : stores used in state management
│ ├── styles` : contain any global and reusable styles
│ ├── utils` : any other functionality considered reusable code that can be referenced
│ ├── views` : contains the actual views of the project that include the main content and components within
style, package, configuration, and other project files
Contributing
Anyone is welcome to create an issue to build, discuss or request a new feature or update to the existing code base. Please keep in mind the following when submitting an issue. We consider merging high value features that may be utilized by the majority of scaffold users. If this is not a common feature or fix, consider adding it to the component library or cookbook. Please refer to the project's architecture and style when contributing.
If submitting a feature, please reference the project structure shown above and try to follow the overall architecture and style presented in the existing scaffold.
Learn More Next Js
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!
Deploy on Vercel
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more details.