买了Hostinger主机，如何搭建在线记事本应用【完整教程】

为什么我需要一个在线记事本工具？

作为一个长期在互联网上摸索副业的人，我的日常状态基本是：电脑开三四个窗口，手机备忘录里存了七八条灵感，微信文件传输助手当临时草稿箱，桌面堆着十几个TXT文件。

说实话，这种状态特别混乱。有一次我在手机备忘录里写了一个客户的需求要点，回到家打开电脑，死活想不起记在哪了，翻了半天才在某个旧笔记本里找到——还是手写的，拍了张照片存在相册里。这种碎片化的信息管理方式，让我感觉自己像个在垃圾场里找金子的拾荒者。

后来我尝试过用市面上的云端记事工具，比如印象笔记、Notion、Typora配合同步盘。但问题来了：

• 免费版功能阉割太严重，广告和弹窗特别烦人
• 数据存储在别人的服务器上，总感觉不安全，万一服务商跑路呢？
• 想自定义一些功能，比如特定标签、自定义字段、固定模板，这些SaaS服务根本做不到
• 年费也不便宜，动辄几百块，对于一个副业初期的人来说是笔不小的开销

所以我就萌生了一个想法：自己搭建一个属于我的在线记事本应用。不依赖任何第三方平台，想怎么改就怎么改，数据完全掌握在自己手里，而且想着以后说不定还能做成一个付费小工具，给有同样需求的人提供服务。

一开始我想过用免费的部署平台，比如Vercel、Netlify，但试了半天发现限制太多——服务器在中国大陆访问速度极慢，数据库连接不稳定，甚至有些平台对个人用户有审核限制。折腾了半个月，差点就要放弃了。

直到我遇到了Hostinger。

为什么选Hostinger来部署？

其实我之前对虚拟主机一直有偏见，觉得性能不如VPS。但Hostinger彻底改变了我对“便宜主机”的认知。

先说价格。每个月大概17块钱人民币就能搞定，这是我见过最便宜的入门槛方案了。很多人觉得便宜没好货，但Hostinger用下来给我的体验是：便宜只是因为优化做得好，不代表质量差。

再说性能。它用的是LiteSpeed Web Server技术，配合LSCache插件，加载速度比我一些朋友用的几百块的云服务器还快。我测试了一下，我的记事本应用首页加载最快只要0.4秒，这体验完全不输给那些大厂应用。

最关键的是，Hostinger提供了一键部署环境。我以前配置LNMP环境至少要折腾两三个小时，在Hostinger管理面板里，你只需要点几下按钮，PHP、MySQL、SSL证书、域名解析全部自动配好。这对像我这种不太精通服务器运维的副业人来说，简直是大救星。

还有一点，Hostinger的客服响应速度也很快。我半夜两三点遇到一个数据库连接问题，提交工单不到十分钟就有人回应了，这种支持力度在便宜主机里真的少见。

如果你还没买主机，我强烈建议你通过这个链接购买Hostinger主机，有优惠价（约¥17/月起），我自己也是从这买的，用着确实香。

好了，不管你已经买了还是准备买，下面直接进入正题，手把手教你三步搭建属于自己的在线记事本应用。

三步部署教程

第一步：设计数据库结构（大约10分钟）

首先，你需要为记事本设计底层数据库。进入Hostinger的hPanel控制面板，找到“phpMyAdmin”并创建一个新的数据库，我给它取名叫做my_notes_db。

建好数据库后，执行下面的SQL语句来创建记事本的数据表：

CREATE TABLE notes (
  id INT AUTO_INCREMENT PRIMARY KEY,
  title VARCHAR(255) NOT NULL,
  content TEXT NOT NULL,
  created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
  updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
  status TINYINT DEFAULT 1,
  category VARCHAR(100) DEFAULT '默认分组'
);

这张表能存标题、正文、创建修改时间、分组分类。足够日常记事用了，以后想加字段随时再改。

如果你想加用户登录功能（毕竟这是你的私人记事本），还可以再建一个管理员表，但初期用不上，所以先跳过。

• 登录Hostinger hPanel → 找到数据库管理
• 创建数据库并记下用户名、密码、主机名
• 运行上面的SQL创建记录表

第二步：上传记事本核心PHP代码（大约15分钟）

数据库准备好之后，接下来就是写代码。整个记事本应用我封装成了三个PHP文件：

• config.php — 数据库连接配置
• index.php — 主界面，展示所有笔记列表
• save.php — 保存和更新笔记内容的接口

核心的config.php长这样（占位配置，等你买了主机后替换）：

<?php
$servername = "你的数据库主机地址";
$username = "你的数据库用户名";
$password = "你的数据库密码";
$dbname = "你的数据库名";

$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
    die("连接失败: " . $conn->connect_error);
}
$conn->set_charset("utf8mb4");
?>

index.php的前端部分用了一个极简的UI设计——左侧显示笔记列表，右侧是编辑区域。没有复杂的前端框架，纯原生HTML+CSS，加载快也不占资源。

具体操作流程：

1. 用FTP工具（比如FileZilla）连接到你的Hostinger空间
2. 在public_html目录下创建一个名为notes的文件夹
3. 把上面的三个文件上传到这个文件夹里

第三步：绑定域名、设置HTTPS（大约5分钟）

上传完成后，访问你的域名加上/notes路径，应该就能看到记事本的主界面了。

这时候你肯定不想用裸的HTTP明文传输，毕竟涉及到个人隐私。所以在Hostinger面板里开启免费SSL证书，整个部署过程就圆满了。

• 在hPanel里找到“Security” → “SSL”
• 选择Let’s Encrypt，填写你的域名
• 自动签发证书，几分钟后生效

到现在为止，你的在线记事本已经正式上线了！整个过程不会编程也没关系，我准备的源码里注释很详细，照着上传就能用。

核心功能介绍

我搭建的这套记事本应用，功能虽然精简但绝对够用：

无限分类管理：你可以给每条笔记添加分类标签，比如“工作灵感”、“副业复盘”、“购物清单”，然后在侧边栏按分类筛选，再也不用在一堆杂乱文字里找东西了。

实时自动保存：写笔记的时候不小心关掉页面都不用担心，系统会在你输入停顿后自动保存草稿，数据不会丢失。

Markdown快捷支持：在正文区域支持Markdown语法，加粗、标题、列表、代码块都能渲染成富文本格式，适合技术党记录代码片段和技术文档。

全站响应式：手机上用浏览器打开也一样流畅，通勤路上的灵感随手记下，到家打开电脑桌面端同步更新，无缝衔接。

搜索功能：按标题或正文关键词进行模糊搜索，哪怕你只记得零碎的词语也能瞬间找到原笔记。

最爽的一点是，这套系统完全是为我自己量身定做的，没有任何广告，也不强制更新，更不会突然告诉我“你的存储空间已满，请付费升级”。

而且，如果你的互联网朋友看到了你的记事本系统，觉得很好用，你甚至可以直接把它部署给他们用，顺便收个几十块的手工费或服务费，这也算是一个小小的副业收入来源。

写在最后

从一台空荡荡的虚拟主机，到一个功能完好的在线记事本应用，这个过程只花了我一个晚上。在Hostinger上部署的过程中，除了最开始买域名犹豫了一下，其余操作基本没遇到任何卡顿。

现在我的所有灵感、客户资料、记账信息、学习笔记都整整齐齐地躺在这个自建的记事本里，国内访问速度飞快，数据完全自主，心情舒适度直接拉满。

如果你也想拥有一个属于自己的在线记事本工具，或者有其他搭建需求（企业内部知识库、个人博客、在线工具箱），我把我已经调好的完整源码分享出来。

联系我的QQ：2445964978，备注“记事本源码”，我会把全套PHP代码和部署文档发给你。

另外，还没搞定主机的朋友，建议趁优惠入手：点这里购买Hostinger主机，约¥17/月，这个性价比只涨不降，毕竟创业路上，省下来的都是利润。

现在，动起来吧。把那些散落在各个角落里的信息，收拢到一个真正属于你的数字空间里。