Crypto Store

A simple and fast Frontend NFTs store where you can see a list of NFTs and add them to your Wallet.

💻 Preview

🔥 Used Technologies

• Vue.js: An approachable, performant and versatile framework for building web user interfaces;
• Vue Routes: The official router for Vue.js;
• Tailwind CSS: A utility-first CSS framework packed with classes that can be composed to build any design, directly in your markup;
• Pinia: The Vue Store that you will enjoy using;
• Vitest: A Vite-native unit test framework. It's fast;
• Axios: Promise based HTTP client for the browser and node.js.

📚 Applied Knowledge

🎉 Over all, Vue.js!

• How to manage Routes in Vue.js;
• Conditional rendering in Vue.js;
• Calling APIs in Vue.js;
• State and Global State management in Vue.js;
• State persistance;
• Unit tests with Vitest.

🌳 Project structure

• src/assets: Static assets such as svgs;
• src/components: Global components;
• src/router: Base config for the application's routes;
• src/services: Basically, services related to API connection;
• src/stores: Global stores based on Pinia;
• src/stores: Global types;
• src/utils: Utilitary functions use through the project;
• src/views: Filles loaded based on the current route;
• src/views/$view/components: View specific components;

🚀 Performance

✅ Tests Coverage

🔧 Running Locally

• Setup your Vue.js environment
• Install JSON Server
• Run yarn
• Run json-server --watch server.json --delay 300 --port 4000
• Run yarn dev
• Access http://localhost:5173