https://github.com/mindsgn/arena-test

https://github.com/mindsgn/arena-test

Last synced: 15 days ago
JSON representation

• Host: GitHub
• URL: https://github.com/mindsgn/arena-test
• Owner: mindsgn
• Created: 2025-03-02T16:48:27.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2025-03-02T17:23:25.000Z (over 1 year ago)
• Last Synced: 2025-03-02T18:27:07.251Z (over 1 year ago)
• Language: TypeScript
• Size: 54.7 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
## Task

Please build a hero component and a navbar. This should be built as a Next.js project with Typescript. It should be responsive across different devices. Please create a GitHub repo and deploy the project to Vercel. You can choose which CSS framework to work with and the styling is completely up to you. Please be creative with the demo content in the hero component and navbar. The end product should be a Vercel site I can visit to see your work and a GitHub repo to review your code.

# Block Money Landing Page

This project is a landing page for Block Money, a web3 payments solution. It's built with Next.js, TypeScript, and Tailwind CSS.

## Features

*   **Hero Section:**  A visually appealing hero section with a Spline scene and engaging text.

*   **Infinite Marquee:**  A scrolling marquee showcasing key features and benefits.

*   **Animated Background:**  An animated background with orbiting orbs and a blurred effect.

*   **Loading Screen:**  A loading screen that displays while the application is initializing.

*   **Responsive Design:**  The layout adapts to different screen sizes.

## Technologies Used

*   [Next.js](https://nextjs.org/):  A React framework for building performant web applications.

*   [TypeScript](https://www.typescriptlang.org/):  A typed superset of JavaScript.

*   [Tailwind CSS](https://tailwindcss.com/):  A utility-first CSS framework.

*   [Framer Motion](https://www.framer.com/motion/):  A library for creating animations.

*   [@splinetool/react-spline](https://spline.design/):  A library for integrating Spline scenes into React applications.

*   [Zustand](https://github.com/pmndrs/zustand):  A small, fast, and scalable bearbones state-management solution.

*   [Lucide React](https://lucide.dev/): A library of beautiful, consistent icons.

## Prerequisites

*   [Node.js](https://nodejs.org/) (version 18 or higher)

*   [npm](https://www.npmjs.com/) or [Yarn](https://yarnpkg.com/)

## Installation

1.  **Clone the repository:**

    ```bash

    git clone https://github.com/mindsgn/arena-test

    cd arena-test

    ```

2.  **Install dependencies:**

    ```bash

    npm install  # or yarn install

    ```

## Development

1.  **Start the development server:**

    ```bash

    npm run dev 

    ```

    This will start the Next.js development server at `http://localhost:3000`.

## Building and Running in Production

1.  **Build the application:**

    ```bash

    npm run build  # or yarn build

    ```

2.  **Start the production server:**

    ```bash

    npm run start  # or yarn start

    ```