Let's get started with a Java Projects Web Page!

  1. Login into your Code.Org account.
  2. Click on your name.
  3. Choose: My Projects
  4. Click on your My First Web Site project.
  5. Click on the Add HTML button.
  6. Right click on: new-5.html
  7. Choose: Rename
  8. Name this file: java.html
  9. Delete all the lines in this file.
  10. Copy the Java Page Template (HTML) code (below).
  11. Paste that code into your java.html file.
  12. Change your page title, your Author name, and your page heading to something appropriate
  13. Replace all the Put-your-repl.it-username-here with your Repl.It username.
  14. Click: Refresh and Save

Java Projects Page Template (HTML)

<!doctype html>
<html>
  <head>
    <title>page title goes here</title>
    <!-- put your name in this comment line -->
    <link href="style.css" rel="stylesheet"/>
  </head>
  <body>
      <nav>
      <a href="index.html">Home</a> |
      <a href="table.html">Table</a> |
      <a href="form.html">Form</a> |
      <a href="multimedia.html">Multimedia</a> |
      <a href="javascript.html">JavaScript</a> |
      <a href="temperature.html">Temperature</a> |
      <a href="java.html" class="selected">Java</a>
    </nav>
    <h1>put page heading here</h1>
    <div class="myDiv">
      <ol>
        <li><a href="https://repl.it/@Put-your-repl.it-username-here/InputOutput" 
        target="_blank">Input/Output</a> Code.</li>
        <li><a href="https://repl.it/@Put-your-repl.it-username-here/VariablesFunctions" 
        target="_blank">Variables & Functions</a> Code.</li>
        <li><a href="https://repl.it/@Put-your-repl.it-username-here/TryCatch2" 
        target="_blank">Try/Catch</a> Code.</li>
        <li><a href="https://repl.it/@Put-your-repl.it-username-here/Grade" 
        target="_blank">Using <code>switch</code></a> Code.</li>
        <li><a href="https://repl.it/@Put-your-repl.it-username-here/Thirteens" 
        target="_blank">Using <code>while</code></a> Code.</li>
        <li><a href="https://repl.it/@Put-your-repl.it-username-here/GCPCourse" 
        target="_blank">Multiple Classes</a> Code.</li>
        <li><a href="https://repl.it/@Put-your-repl.it-username-here/ReadFile" 
        target="_blank">Reading a File</a> Code.</li>
        <li><a href="https://repl.it/@Put-your-repl.it-username-here/HelloGUI" 
        target="_blank">Hello World GUI</a> Code.</li>
        <li><a href="https://repl.it/@Put-your-repl.it-username-here/SimpleButtons" 
        target="_blank">Simple Buttons GUI</a> Code.</li>
        <li><a href="https://repl.it/@Put-your-repl.it-username-here/TempConvert" 
        target="_blank">Temperature Conversion GUI</a> Code.</li>
      </ol>
    </div>
    <p>This page was last modified on: 
     <script>document.write(document.lastModified);</script>.</p>
  </body>
</html>

JavaScript Styles (CSS)

Example