📄 package.
json
"name": "mission-website",
"version": "1.0.0",
"private": true,
"dependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
---
📄 public/[Link]
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/[Link]" />
<meta name="viewport" content="width=device-width, initial-
scale=1" />
<title>Multi-generational Interstellar Space Mission</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
</body>
</html>
---
📄 src/[Link]
import React from 'react';
import ReactDOM from 'react-dom/client';
import './[Link]';
import App from './App';
const root = [Link]([Link]('root'));
[Link](
<[Link]>
<App />
</[Link]>
);
---
📄 src/[Link]
import React from 'react';
import './[Link]';
import Hero from './components/Hero';
import About from './components/About';
import Team from './components/Team';
import Proposal from './components/Proposal';
import Benefits from './components/Benefits';
import Contact from './components/Contact';
function App() {
return (
<div className="App">
<Hero />
<About />
<Team />
<Proposal />
<Benefits />
<Contact />
</div>
);
export default App;
---
📄 src/[Link]
body {
margin: 0;
font-family: 'Segoe UI', sans-serif;
background-color: #0a0a23;
color: #fff;
section {
padding: 60px 20px;
text-align: center;
h1, h2, h3 {
color: #00d4ff;
.App {
max-width: 1100px;
margin: 0 auto;
ul {
list-style-type: none;
padding: 0;
a{
color: #00d4ff;
text-decoration: none;
a:hover {
text-decoration: underline;
---
📄 src/components/[Link]
import React from 'react';
function Hero() {
return (
<section>
<h1>Multi-generational Interstellar Space Mission</h1>
<p>Pioneering humanity’s journey beyond the stars</p>
</section>
);
export default Hero;
---
📄 src/components/[Link]
import React from 'react';
function About() {
return (
<section>
<h2>About the Project</h2>
<p>
Our project envisions a sustainable, multi-generational space mission
to make interstellar travel possible across distances far beyond
a human lifetime. It addresses the challenges of distance, crew
longevity,
and limited resources by proposing a spacecraft with advanced
propulsion,
hybrid energy systems, and sustainable life-support technologies.
</p>
</section>
);
export default About;
---
📄 src/components/[Link]
import React from 'react';
function Team() {
return (
<section>
<h2>Our Team</h2>
<p>
We are 12th grade students from rural India with a strong passion
for space science and innovative ideas for future space exploration.
</p>
<ul>
<li>Ayush Singh</li>
<li>Aadarsh Singh</li>
</ul>
</section>
);
export default Team;
---
📄 src/components/[Link]
import React from 'react';
function Proposal() {
return (
<section>
<h2>The Proposal</h2>
<p><strong>Spaceship Design:</strong> High-efficiency propulsion
with fusion/nuclear/solar sail assistance and hybrid energy systems.</p>
<p><strong>Crew Model:</strong> Artificial gestation, AI mentorship,
and education across generations to ensure continuity.</p>
<p><strong>Sustenance:</strong> Hydroponics, aeroponics, algae
farming, and advanced recycling systems for food and water security.</p>
</section>
);
export default Proposal;
---
📄 src/components/[Link]
import React from 'react';
function Benefits() {
return (
<section>
<h2>Expected Benefits</h2>
<ul>
<li>Safeguarding humanity’s survival beyond Earth</li>
<li>Exploration of new star systems and habitable planets</li>
<li>Uniting humanity in a global vision of space exploration</li>
</ul>
</section>
);
export default Benefits;
---
📄 src/components/[Link]
import React from 'react';
function Contact() {
return (
<section>
<h2>Contact Us</h2>
<p>Email: <a
href="[Link]
com</a></p>
<p>We welcome questions, feedback, and collaborations to push this
vision forward.</p>
</section>
);
export default Contact;