Ravindra Bagale · AWSसर्व coursesया course चे lessonsशोधाEnglish

AWS · मराठी आवृत्ती

7.3 समान step 1: sample website तयार करा

रवींद्र बागले यांच्या course वर आधारित · सहज मराठीत explanation

Server terminal मध्ये हा block run करा. ~/mysite मध्ये index.html, css/style.css आणि custom 404.html बनतील. Sample HTML/code जसे आहेत तसे ठेवा; पुढच्या practice मध्ये content बदलू.

mkdir -p ~/mysite/css
cat > ~/mysite/index.html <<'EOF'
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>My First Cloud Website</title>
  <link rel="stylesheet" href="../../../aws/ch07-static-website-hosting-3-oses-2-web-servers/css/style.css">
</head>
<body>
  <header><h1>Namaste from AWS EC2!</h1></header>
  <main>
    <p>This static website is served by a web server running on an EC2 instance.</p>
    <ul>
      <li>Cloud: Amazon Web Services</li>
      <li>Server: EC2 in the Mumbai region</li>
      <li>Content: HTML + CSS</li>
    </ul>
  </main>
  <footer>Hosted as part of the AWS Hands-On Handbook lab</footer>
</body>
</html>
EOF
cat > ~/mysite/css/style.css <<'EOF'
body   { font-family: Arial, sans-serif; margin: 0; background: #f4f7fb; color: #222; }
header { background: #0b3d6e; color: #fff; padding: 20px; text-align: center; }
main   { max-width: 700px; margin: 30px auto; background: #fff; padding: 20px; border-radius: 8px; }
footer { text-align: center; color: #777; padding: 20px; }
EOF
cat > ~/mysite/404.html <<'EOF'
<!DOCTYPE html><html><body><h1>404 - Page not found</h1><a href="../../../index.html">Go home</a></body></html>
EOF
ls -R ~/mysite

ls -R मध्ये तिन्ही files आणि css folder दिसला पाहिजे.

Lab

nano ~/mysite/index.html मध्ये h1 “Mauli Dairy, Pune – Daily Milk Rates” करा. cat ~/mysite/index.html | head -12 ने बदल पाहा.