Hello World
Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub.
Quick StartCreate a new post1$ hexo new "My New Post"
More info: Writing
Run server1$ hexo server
More info: Server
Generate static files1$ hexo generate
More info: Generating
Deploy to remote sites1$ hexo deploy
More info: Deployment
搭建halo教程
最近通过Halo搭建了个人的博客站,在这里做一下记录。Halo官网其实已经提供了非常全的部署方案,这里我采用的docker 的安装方式(不使用宝塔面板),使用Nginx容器去代理Halo容器,cloudflare去托管解析域名,acme自动更新证书。
为什么要用这些:
不使用宝塔面板,主要是宝塔本身就是一个比较大的软件,在一些小型的服务器上比较吃力。
cloudflare可以有效的隐藏我们的真实IP,一定程度防止被攻击
acme可以自动更新证书,不用手动更新,这样一次搭建后无需再关注服务器端
使用Nginx容器去代理Halo容器,这里的Nginx容器其实不止可以代理Halo的容器,后续所有容器都可以代理,实现https的访问(需要注意的是,cloudflare免费提供了https证书,但是,这是用户到cloudflare的连接是才用https方式,如果服务端没有使用https,那cloudflare到源服务器就不是https的方式连接了。相当于cloudflare去代理了用户的请求,然后再转发给源服务器的)
服务器的连接与配置在开始之前,我们需要准备一下环境:
一台初始化的cen ...
建站感悟:旧岛Land
最近搭建了一个在线的博客站-旧岛Land,写一下网站搭建的感悟,以及中途遇到的问题及如何解决的。
历程最早接触博客类型的项目网站是Hexo,Hexo是一个快速、简洁且高效的博客框架,只需要关注文档内容的编写,hexo也提供了丰富的插件和主题,帮助美化博客站。
在接触Hexo后,第一个使用的主题是Next,因为其简约,又不失单调的的风格是我很喜欢的主题,但是后来发现该主题过于单调,后面又改换了主题
Next主题之后我改换了butterfly主题,这个主题的美观和定制的程度都是远高于Next的,至少个人人为。
Hexo框架虽好,但是有一个问题,就是需要格式化电脑的时候,我就需要代码拷贝出来,否则我就丢失了源代码,无法继续更新,只能重新搭建。这也是为什么转为使用halo的原因之一(曾有一次就是忘记拷贝,丢失源代码,git仓库都是编译后的代码无法使用)
除了上面的问题,还有一个问题就是代码的托管问题,放在gitee仓库优点是访问快,缺点是无法自动构建,每次都需要手动的去gitee仓库更新(大大的差评),github仓库虽然可以不用手动构建,但是国内速度慢,而且可能都不成功。有一种折中的办法:使 ...
koa工程化项目
回想之前写的koa工程化基础项目还是在三年前,那会使用的还是webpack4和koa2.13,现在webpack已经升级到了5,发生了比较大的更新。其中许多插件也更新了,为了适用新的项目,进行一次简单的升级和重构。为了能以后能直接使用,这次加入了脚手架的功能,这样以后就可以通过简单的命令创建koa的工程化目录了。
前言主要分三部分:
Koa应用的工程化搭建
webpack5的配置,打包压缩优化
集成脚手架功能
Koa应用的工程化搭建最小化安装测试先安装koa并运行示例:
123npm init -ynpm install koa
新建index.js
123456789const Koa = require('koa');const app = new Koa();app.use(async (ctx) => { ctx.body = 'Hello World';});app.listen(3000);
打开浏览器:http://localhost:3000/ ,就可以访问到Hello World。
添加路由安 ...
hexo butterfly主题添加对随机图片api的支持
前言最近想再给文章添加封面,但是每一个文章都需要找封面着实麻烦,有没有一种随机的,默认的就可以添加的呢。以下是一种解决方法。
解决过程在butterfly主题中有这样的配置
123456789101112cover: # display the cover or not (是否顯示文章封面) index_enable: true aside_enable: true archives_enable: true # the position of cover in home page (封面顯示的位置) # left/right/both position: both suffix: 1 # When cover is not set, the default cover is displayed (當沒有設置cover時,默認的封面顯示) default_cover: https://api.aixiaowai.cn/api/api.php
如果文章没有指定封面,就使用默认封面,这里如果添加随机图片的api,是不是默认就随机的;
设置之后每一个文章封面都显示 ...
webpack5基础学习
本文主要记录webpack5的基础学习。最终代码放在文章末尾github上
什么是Webpack一个打包编译静态资源的工具,可以把前端的静态资源进行打包压缩,有利于用户访问,减少带宽的占用
Webpack五大概念官方Webpack五个概念:https://webpack.docschina.org/concepts/
入口(entry)
官网介绍:入口起点(entry point) 指示 webpack 应该使用哪个模块,来作为构建其内部 依赖图(dependency graph) 的开始。进入入口起点后,webpack 会找出有哪些模块和库是入口起点(直接和间接)依赖的。
默认值是 ./src/index.js,但你可以通过在 webpack configuration 中配置 entry 属性,来指定一个(或多个)不同的入口起点
123module.exports = { entry: './path/to/my/entry/file.js',};
入口起点(entry point)指示 webpack 应该使用哪个模块,来作为构建其内部 ...
7月8日电商笔记
记录一下毕业后做电商的一些想法和思路,记录比较随意,想到哪写到哪。
电商的本质开始接触电商的那会,最简单的想法就是卖货,赚钱,怎么运营,刷!这其实没错,但是后面如果深入思考一下:为什么同样的产品,别人就会选择你的呢?当然这里可能是价格原因,售后服务,品牌效应等等;
但是主要的原因还是解决方案,这款产品能给用户解决什么问题,如果一款产品能解决用户问题,并且这款产品在市场上还没有找到,那么这款产品注定是一款好的产品。一款好的产品往往还需要看市场的需求,如果需求空间小,那么这款产品再好,使用群体小也是无法做到爆款程度的;
打一个比方:现在的风扇各式各样,有小风扇,台式的,立体的、空调扇,桌面用的等等,这其实就是在细分人群,细分用户的需求,比如有些人可能就需要桌面上用的,上网一搜,都是那种立式的,但是刚好就有一家是做桌面上用风扇,用户选择的概率就非常大,那这第一个做桌面上用的风扇的人就很吃香,因为找对了人群,并且为这个人群提供了很好的解决方案。
但是这种品想要维持一个热度和爆款,就需要根据市场分析不断优化,因为市场只要有一个爆款, 那必然大家都会去跟进,比如价格、外观、售后服务等等。
其实就是 ...
CSS3基础语法与盒模型
根据慕课网零基础前端体系课程总结笔记。这是第二周的内容总结笔记。这里主要是基本CSS知识,移动端的适配需要到第17周。文章可能略显简单或者纰漏,之后慢慢修改。
CSS入门基础CSS简介CSS(cascading style sheet,层叠式样式表)是用来给HTML标签添加样式的语言,允许对网页进行美化和布局设计。CSS3作为CSS的最新版,引入了更多高级样式动画、3D特效和移动设备优化等功能。前端开发通常涉及HTML(构建结构)、CSS(定义样式)和JavaScript(实现交互),这三层共同构成了现代Web应用的基础。
CSS样式和结构分离CSS样式和结构分离,样式和结构不用“杂着写”,而是彼此分开:HTML就负责结构,CSS负责样式HTML和CSS怎么结合呢? 选择器就是两者的纽带
CSS的本质CSS没有加减乘除、与或非、循环、选择、判断,CSS不是“编程”,就是简单直接的罗列样式,背诵CSS属性是非常重要的,属性背诵熟练程度决定了做网页的速度
CSS的书写位置内嵌式在学习CSS时,最最常使用内嵌式,顾名思义,就是内嵌在.html文件中,在<head></he ...
HTML5基础语法与标签
根据慕课网零基础前端体系课程总结笔记。这是第一周的内容总结笔记。文章可能略显简单或者纰漏,之后慢慢修改。
HTML5语法与基础标签简介本次课程旨在介绍HTML5的基础知识和应用,包括互联网基本原理、HTML语言及其标签使用、以及HTML5新增特性。课程内容涵盖了创建首个网页、浏览网页方法、HTML元素结构、字符集设定、元标记、段落和标题标签,以及DIV标签的应用。
互联网基本原理在本地开发,在服务器共享:
程序员在本地计算机上使用HTML、CSS、JS开发程序后,将这些文件上传至服务器以便用户访问。服务器具有共享文件能力,通过域名访问特定文件夹中的文件。更新服务器上的网页或程序只需在本地继续开发并上传新版本
理解HTTP协议:从请求到响应的过程:
用户通过输入网址或扫描二维码发起HTTP请求,请求被服务器接收并解析,服务器找到相应的文件后返回HTTP响应,完成网页显示过程。
深入理解HTTP协议及其在Web开发中的应用:
HTTP协议是互联网数据传输的应用层基础协议,由请求和响应组成。前端关注页面的美观和互动效果,后端处理数据查询和逻辑运算。学习编程前,应先掌握HTML、CSS和J ...
