正文

新手必看！用Flask框架轻松搭建个人简历网站教程

/0 浏览量
0514

在这个数字化时代，一个个人简历网站不仅能够展示你的专业技能和经历，还能让你在求职过程中脱颖而出。Flask是一个轻量级的Web框架，非常适合新手入门。下面，我将为你详细讲解如何使用Flask框架搭建一个个人简历网站。

环境准备

在开始之前，请确保你的电脑上已安装以下软件：

  • Python 3.x
  • Flask
  • HTML/CSS基础

创建项目

  1. 打开终端或命令提示符。
  2. 创建一个新的文件夹，用于存放项目文件，例如：resume_site。
  3. 切换到该文件夹，并使用以下命令安装Flask：
pip install flask

文件结构

在你的项目文件夹中，创建以下文件：

  • app.py：主程序文件。
  • templates：存放HTML模板的文件夹。
  • static：存放CSS和JavaScript文件的文件夹。
  • resume.html：个人简历模板文件。

编写代码

1. app.py

from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def home():
    return render_template('resume.html')

if __name__ == '__main__':
    app.run(debug=True)

2. templates/resume.html

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>个人简历</title>
    <link rel="stylesheet" href="static/style.css">
</head>
<body>
    <header>
        <h1>张三</h1>
        <p>前端开发工程师</p>
    </header>
    <main>
        <section>
            <h2>教育背景</h2>
            <p>2015-2019，某某大学，计算机科学与技术专业</p>
        </section>
        <section>
            <h2>工作经验</h2>
            <p>2019-至今，某某公司，前端开发工程师</p>
        </section>
        <section>
            <h2>技能特长</h2>
            <ul>
                <li>HTML/CSS</li>
                <li>JavaScript</li>
                <li>Vue.js</li>
                <li>React.js</li>
            </ul>
        </section>
    </main>
    <footer>
        <p>联系方式：zhangsan@example.com</p>
    </footer>
</body>
</html>

3. static/style.css

body {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    margin: 0;
    padding: 0;
}

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

main {
    margin: 20px;
}

section {
    margin-bottom: 20px;
}

footer {
    background-color: #333;
    color: #fff;
    padding: 10px;
    text-align: center;
}

运行项目

  1. 在终端或命令提示符中，进入项目文件夹。
  2. 运行以下命令启动Flask服务器：
python app.py
  1. 打开浏览器，访问 http://127.0.0.1:5000/，即可看到你的个人简历网站。

总结

通过以上步骤，你已经成功使用Flask框架搭建了一个个人简历网站。你可以根据自己的需求，修改模板内容和样式，让简历更加个性化。祝你求职顺利！

-- 展开阅读全文 --