1/** @jsxImportSource https://esm.sh/react */
2import { renderToString } from "npm:react-dom/server";
3
4export default async function(req: Request) {
1# DriveLuxe - Modern Car Rental Website
2
3A responsive and modern car rental website built with React and TailwindCSS. This project showcases a luxury car rental service with smooth animations, responsive design, and a clean user interface.
4
5## Features
8- **Modern UI**: Clean and elegant design with attention to detail
9- **Animations**: Subtle animations and transitions for enhanced user experience
10- **Multi-page Layout**: Complete website with multiple pages using React Router
11- **Car Listings**: Browse, filter, and search for available cars
12- **Booking System**: Multi-step booking process with form validation
23## Technologies Used
24
25- **React**: Frontend library for building the user interface
26- **TailwindCSS**: Utility-first CSS framework for styling
27- **React Router**: For navigation between pages
28- **Hono**: Lightweight web framework for the backend
29
41โ โโโ pages/ # Page components
42โ โโโ index.html # Main HTML template
43โ โโโ index.jsx # React entry point
44โโโ README.md
45```
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React from 'https://esm.sh/react@18.2.0';
3import Button from '../components/ui/Button.jsx';
4
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, { useState, useEffect } from 'https://esm.sh/react@18.2.0';
3import { useParams, useNavigate } from 'https://esm.sh/react-router-dom@6.10.0?deps=react@18.2.0';
4import Button from '../components/ui/Button.jsx';
5import { getCarById, cars } from '../data/cars.js';
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, { useState, useEffect } from 'https://esm.sh/react@18.2.0';
3import { useParams, useNavigate } from 'https://esm.sh/react-router-dom@6.10.0?deps=react@18.2.0';
4import Button from '../components/ui/Button.jsx';
5import { getCarById, cars } from '../data/cars.js';
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, { useState, useEffect } from 'https://esm.sh/react@18.2.0';
3import { useSearchParams } from 'https://esm.sh/react-router-dom@6.10.0?deps=react@18.2.0';
4import CarCard from '../components/ui/CarCard.jsx';
5import Button from '../components/ui/Button.jsx';
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, { useState, useEffect } from 'https://esm.sh/react@18.2.0';
3import { Link } from 'https://esm.sh/react-router-dom@6.10.0?deps=react@18.2.0';
4import Button from '../components/ui/Button.jsx';
5import CarCard from '../components/ui/CarCard.jsx';
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React from 'https://esm.sh/react@18.2.0';
3import { Link } from 'https://esm.sh/react-router-dom@6.10.0?deps=react@18.2.0';
4
5const Button = ({
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React from 'https://esm.sh/react@18.2.0';
3import { Link } from 'https://esm.sh/react-router-dom@6.10.0?deps=react@18.2.0';
4
5const CarCard = ({ car }) => {
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React from 'https://esm.sh/react@18.2.0';
3import { Link } from 'https://esm.sh/react-router-dom@6.10.0?deps=react@18.2.0';
4
5const Footer = () => {
