愿你归来仍是少年

上线了！上线了！我的个人博客这次正式上线啦！

我的个人博客地址：

http://vogos.cn/

  我应该快半个月没写文章了，一直在学习和做这个个人博客，其实之前就上线了，但一直还在测试一些bug，虽然现在也还存在很多bug😂😂后面再慢慢迭代更新吧，下面先展示一下部分页面效果吧：

部分后台页面

---

  图截不全，在我的服务器到期前，具体可到我的网站看效果啊😁照片墙你们访问可能会不加载不出图片，我还没有想到好的办法解决，后面我再慢慢迭代！

Spring Boot开发的个人博客学习李荣密老师的教学，下面简单介绍一下这个项目：

---

我的故事

  我强烈需要一个完完全全属于自己的个人博客网站，虽然我CSDN也用，但看着它上面挂的广告我实在是有点难受😅博客园其实也挺好的，但他的页面风格我不太喜欢…说这么多，但我服务器到期后还是主要在CSDN的🤣🤣真香，嗯！

  这算是一个比较完整的项目了，从代码编写，购买服务器，购买域名和域名备案，为了锻炼自己能力服务器的部署（主要是MySQL8、JDK12,、Tomcat9）也没有使用宝塔，完全使用Linux命令操作，把整个项目部署上线过程顺了一遍，这过程中自己也成长了许多！

---

主要技术栈以及工具与环境

• 后端：Spring Boot + JPA + Thymeleaf

• 数据库：MySQL8.0

• 前端UI：Semantic UI框架

• IDEA

• Maven 3

• JDK 12

• Axure RP 9

• 阿里云服务器

集成的插件

• 编辑器 Markdown

• 内容排版 typo.css

• 动画 animate.css

• 代码高亮 prism

• 目录生成 Tocbot

• 滚动侦测 waypoints

• 平滑滚动 jquery.scrollTo

• 二维码生成 qrcode.js

最后分享一些animate.css动画效果吧

1.  bounce             弹跳
2.	flash              闪烁
3.	pulse              放大，缩小
4.	rubberBand         放大，缩小，弹簧
5.	shake              左右晃动
6.	headShake          左右小幅晃动
7.	swing              左右扇形摇摆
8.	tada               放大，左右上下晃动，缩小
9.	wobble             左右小幅(圆点较远)扇形摇摆
10.	jello              左右左右上下晃动

11.	bounceIn           重复放大缩小
12.	bounceInDown       从上到下出现，弹簧
13.	bounceInLeft       从左到右出现，弹簧
14.	bounceInRight      从右到左出现，弹簧
15.	bounceInUp         从下到上出现，弹簧
16.	bounceOut          从常规到小消失，弹簧
17.	bounceOutDown      从常规到小，从下方消失，弹簧
18.	bounceOutLeft      从常规到小，从左方消失，弹簧
19.	bounceOutRight     从常规到小，从右方消失，弹簧
20.	bounceOutUp        从常规到小，从上方消失，弹簧

21.	fadeIn             渐现
22.	fadeInDown         渐现，从上到下
23.	fadeInDownBig      渐现，从上到下，滑动距离较长
24.	fadeInLeft         渐现，从左到右
25.	fadeInLeftBig      渐现，从左到右，滑动距离较长
26.	fadeInRight        渐现，从右到左
27.	fadeInRightBig     渐现，从右到左，滑动距离较长
28.	fadeInUp           渐现，从下到上
29.	fadeInUpBig        渐现，从下到上，滑动距离较长
30.	fadeOut            渐隐
31.	fadeOutDown        渐隐，从上到下
32.	fadeOutDownBig     渐隐，从上到下，滑动距离较长
33.	fadeOutLeft        渐隐，从左到右
34.	fadeOutLeftBig     渐隐，从左到右，滑动距离较长
35.	fadeOutRight       渐隐，从右到左
36.	fadeOutRightBig    渐隐，从右到左，滑动距离较长
37.	fadeOutUp          渐隐，从下到上
38.	fadeOutUpBig       渐隐，从下到上，滑动距离较长

39.	flip               中心Y轴旋转，放大，缩小
40.	flipInX            元素中心X轴旋转
41.	flipInY            元素中心Y轴旋转
42.	flipOutX           中心X轴旋转，消失
43.	flipOutY           中心Y轴旋转，消失

44.	lightSpeedIn       从右到左，平行四边形，左上角突出进入
45.	lightSpeedOut      从左到右，平行四边形，左上角突出进入

46.	rotateIn           元素中心顺时针旋转进入
47.	rotateInDownLeft   元素左外长半径顺时针旋转进入
48.	rotateInDownRight  元素右外长半径逆时针旋转进入
49.	rotateInUpLeft     元素左外长半径逆时针旋转进入     
50.	rotateInUpRight    元素右外长半径顺时针旋转进入
51.	rotateOut          元素中心顺时针旋转消失
52.	rotateOutDownLeft  元素左外长半径顺时针旋转消失
53.	rotateOutDownRight 元素右外长半径逆时针旋转消失
54.	rotateOutUpLeft    元素左外长半径逆时针旋转消失
55.	rotateOutUpRight   元素右外长半径顺时针旋转消失

56.	hinge              从右上到坐下，顺时针旋转，从上到下消失

57.	rollIn             元素左外长半径顺时针旋转，平滑进入
58.	rollOut            元素右外长半径顺时针旋转，平滑进入

59.	zoomIn             元素由小变大进入
60.	zoomInDown         元素由小变大，从上方进入
61.	zoomInLeft         元素由小变大，从左方进入
62.	zoomInRight        元素由小变大，从右方进入
63.	zoomInUp           元素由小变大，从下方进入
64.	zoomOut            元素由大变小，消失
65.	zoomOutDown        元素由大变小，从下方消失
66.	zoomOutLeft        元素由大变小，从左方消失
67.	zoomOutRight       元素由大变小，从右方消失
68.	zoomOutUp          元素由大变小，从上方消失

69.	slideInDown        元素从上到下，平滑进入
70.	slideInLeft        元素从左到右，平滑进入
71.	slideInRight       元素从右到左，平滑进入
72.	slideInUp          元素从下到上，平滑进入
73.	slideOutDown       元素从上到下，平滑消失
74.	slideOutLeft       元素从右到左，平滑消失
75.	slideOutRight      元素从左到右，平滑消失
76.	slideOutUp         元素从下到上，平滑消失

编程之外