search

sakke82 / digital-CV

My digital CV with Markdown
0 stars 0 forks source link

Feature Request: Create HTML CV using Neocities #1

Open brylie opened 1 month ago

brylie commented 1 month ago

Create a professional CV (Curriculum Vitae) using HTML and CSS, and host it on Neocities. This project will help you learn basic web development skills while creating a practical, online version of your CV.

Steps

  1. Sign up for a Neocities account at https://neocities.org/

  2. Create a new site or use the default one provided

  3. Create two files in your Neocities site:

    • index.html (for the HTML structure of your CV)
    • styles.css (for the CSS styling of your CV)

  4. Copy the following HTML template into your index.html file:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Your Name - CV</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <header>
        <h1>Your Name</h1>
        <p>Web Developer</p>
    </header>

    <main>
        <section id="contact">
            <h2>Contact Information</h2>
            <ul>
                <li>Email: your.email@example.com</li>
                <li>Phone: (123) 456-7890</li>
                <li>Location: City, Country</li>
                <li>LinkedIn: <a href="https://www.linkedin.com/in/yourprofile">yourprofile</a></li>
            </ul>
        </section>

        <section id="summary">
            <h2>Professional Summary</h2>
            <p>A brief, compelling summary of your professional background and key skills.</p>
        </section>

        <section id="experience">
            <h2>Work Experience</h2>
            <article>
                <h3>Job Title</h3>
                <p>Company Name | Start Date - End Date</p>
                <ul>
                    <li>Key responsibility or achievement</li>
                    <li>Another key responsibility or achievement</li>
                    <li>Yet another key responsibility or achievement</li>
                </ul>
            </article>
            <!-- Add more job entries as needed -->
        </section>

        <section id="education">
            <h2>Education</h2>
            <article>
                <h3>Degree Name</h3>
                <p>Institution Name | Graduation Date</p>
                <p>Any relevant details or achievements</p>
            </article>
            <!-- Add more education entries as needed -->
        </section>

        <section id="skills">
            <h2>Skills</h2>
            <ul>
                <li>Skill 1</li>
                <li>Skill 2</li>
                <li>Skill 3</li>
                <li>Skill 4</li>
            </ul>
        </section>
    </main>

    <footer>
        <p>&copy; 2024 Your Name. All rights reserved.</p>
    </footer>
</body>
</html>
  1. Copy the following CSS template into your styles.css file:
body {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    color: #333;
    max-width: 800px;
    margin: 0 auto;
    padding: 20px;
}

header {
    background-color: #f4f4f4;
    padding: 20px;
    text-align: center;
}

h1 {
    margin-bottom: 0;
}

h2 {
    border-bottom: 2px solid #333;
    padding-bottom: 10px;
}

section {
    margin-bottom: 30px;
}

ul {
    padding-left: 20px;
}

footer {
    text-align: center;
    margin-top: 20px;
    font-size: 0.8em;
}

  1. Customize the HTML content with your personal information, work experience, education, and skills.

  2. Use a generative AI (such as ChatGPT) to help you improve the content and style of your CV. Some suggestions:

    • Ask for help in writing compelling job descriptions
    • Request ideas for a color scheme that suits your personality or industry
    • Get suggestions for additional sections that might be relevant to your field

  3. Modify the CSS to personalize the look of your CV. Consider changing colors, fonts, or layout to make it unique to you.

  4. Save your changes in Neocities and preview your CV to make sure it looks good.

  5. Once you're satisfied with your CV, copy the Neocities URL for your site.

  6. Reply to this GitHub issue with your Neocities URL so we can see your completed CV!

Tips

Resources

Good luck with your HTML CV project! If you have any questions or need help, don't hesitate to ask in the comments of this issue.

sakke82 commented 1 month ago

Hi Brylie, This is what my CV looks like (it is not finished yet), I am already satisfied that I was making these modifications and I see the result. BR , Sakke https://sakke82.neocities.org/HTML%20CV%20/

brylie commented 1 month ago

Great progress! Remember, the goal of this exercise is to practice:

You've started well by using paragraph tags <p>...</p>, but to meet the objective of completing tasks as you would in a professional setting, you need to finish the task promptly. Please complete the remaining sections of your CV as soon as possible.

sakke82 commented 1 month ago

Hi Brylie,

I am dedicated to improving my skills daily, working on my imaginary restaurant webpage and Neocities CV. Each day, I learn new techniques and refine my designs, reflecting my growing expertise.

BR, Sakke

http://127.0.0.1:5500/index.html#home

https://sakke82.neocities.org/HTML%20CV%20/