# RoyalCity

## What is RoyalCity?

RoyalCity is a modern real estate investment platform that combines traditional property investing with cryptocurrency payments. Built with React and Tailwind CSS, it mirrors the functionality of Arrived.com while adding blockchain-based transaction capabilities.

<img src="./public/royalcity00.png" alt="Royal City" style="width:100%; height:auto;" />

## Getting Started
- Prerequirements:<br/>
  Node v22+
- Installing Dependecies:<br/>
  npm install --verbose 
-  Running project:<br/>
  npm start

## Key Features

- Cryptocurrency-enabled property transactions
- Mobile-responsive design
- SEO-optimized architecture
- Real-time market data integration
- Interactive 3D property visualization
- Smart contract integration for secure transactions

## Technical Overview

The platform is built using:

- React for component-based architecture
- Tailwind CSS for responsive styling
- React Router for client-side routing
- Three.js for 3D property visualizations
- Web3.js for blockchain interactions

## Core Components

1. **Home Page** - Hero Section with value proposition

- Featured Properties Grid (3 properties)
- "Why Choose Us" highlighting crypto benefits
- Investment Guide with step-by-step process
- Blog Preview with latest 3 posts
- Discord Community Section

2. **Properties Page**

- Filterable property grid
- Advanced search functionality
- Detailed property cards
- Three.js 3D visualization

3. **About Us Page**

- Company vision and mission
- Team profiles
- Platform statistics

4. **Blog Section**

- Category filtering
- Search functionality
- Author profiles
- Social sharing buttons

## Development Guidelines

1. **Component Creation**

- Follow atomic design principles
- Use TypeScript for type safety
- Implement responsive designs using Tailwind breakpoints
- Add proper comments and documentation

2. **State Management**

- Use React Context for global state
- Implement Redux for complex state management
- Keep component state minimal

3. **Security Considerations**

- Implement proper input validation
- Secure wallet connections
- Follow best practices for crypto transactions
- Regular security audits

## Learn More

- You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
- To learn React, check out the [React documentation](https://reactjs.org/).

## Contributing

Contributions are welcome! Please:

1. Create a feature branch
2. Write comprehensive tests
3. Document new features
4. Ensure code style consistency
5. Submit pull requests with clear descriptions

## Acknowledgments

Special thanks to the RoyalCity team for inspiration and the React/Tailwind CSS communities for their continued support and resources.