开发一个在线代码对比工具

sxkk20081年前114
前言在开发过程中,我们经常需要用到代码对比,对比下代码是否一致,有哪些改动,方便我们可以查看问题,今天我们就来说实现下,其实很简单,不需要后端,纯前端就可以实现。Monaco EditorMonaco...

Markdown 写 PPT 是如何实现的?

sxkk20081年前80
前言Markdown 是一种轻量的标记语言,我们只需要写 md 格式文件,不必考虑文档的排版,被广泛用于博客写作,技术文档编写等,程序员们都热爱,但我们工作中除了写文档,有时候还需要汇报工作,技术分享...

《成语小秀才》部署教程

sxkk20081年前84
2-3 分钟后会在屏幕上输出宝塔面板的登录地址,宝塔面板会随机生成用户名、密码和端口,我们需要把这些地址保存到本地,以免下次忘记。

接下来我们需要在云服务器上设置安全组或者防火墙,放行自动生成的端口。

腾讯云配置安全组

开通了端口,输入宝塔面板地址,输入用户名和密码就可以登录了 宝塔面板登录

域名解析

腾讯云域名解析

在你的域名服务商后台,将一个域名解析到 这台这台服务器 ip,解析完成后,你就可以使用域名访问了。

安装 PHP+mysql

登录后要先绑定一个宝塔账号,这个大家自行注册就可以了 选择系统推荐的 LNMP 环境 绑定成功后,我们来安装 PHP+mysql,系统会自动弹窗框让我们来选择环境,我这里选择 LNMP

  • 急速安装,安装时间极快(5-10 分钟),版本与稳定性略低于编译安装,适合快速部署测试
  • 编译安装,安装时间长(30 分钟到 2 小时),性能最大化,适合生产环境, 点击一键安装后,宝塔面板就会开始安装环境了

LNMP 环境安装进度 等待 10 分钟后,环境安装完成,当然有经验的同学可以自行安装 PHP+mysql 的环境,但是使用宝塔面板对新手比较友好。

访问IP显示会宝塔404页面 此时访问我们的 IP 就可以看到页面,说明我们的环境已经安装成功了。

安装微擎

微擎官网:https://www.we7.cc/

微擎官方文档:https://www.kancloud.cn/donknap/we7/136557

微擎源码地址:https://gitee.com/we7coreteam/pros

微擎是一款小程序和公众号管理系统,可以实现微信平台(mp.weixin.qq.com)不能实现的功能,例如商城,餐饮,酒店,汽车,门店,同城,各类行业解决方案,营销,推广,吸粉,游戏,物联网和人工智能等功能,这些应用大部分收费,也有免费的应用,大家可以在官网上搜索安装。

点击网站,添加网站,输入你自己的要解析的域名, 宝塔面板添加网站

选择创建数据库,和 FTP,点击提交,此时输入我们的域名可以看到如下页面

宝塔默认创建的页面

说明我们的网站创建成功了。

安装微擎框架

在网站 ftp 目录下上传微擎框架的源码 上传微擎框架源码

上传完成后点击 zip 文件解压

设置网站默认站点

点击默认站点,设置我们刚才创建的网站

输入IP,开始安装微擎 输入 IP 地址,就可以进入微擎的安装页面了。 微擎安装页面检查环境

安装过程中会检查 PHP 环境要求,若检查不成功,我们需要修改相应的 PHP info 文件。

微擎配置数据库和密码

点击继续输入刚才创建的数据库信息,并且设置微擎后台密码

微擎安装完成

点击继续安装完成

前言相信很多朋友都玩过这款小游戏,叫成语秀才,没体验过的朋友可以点击这里,扫码体验,这款小游戏开发起来还是比较困难的,首先要有一份海量的题库,然后在每道题都有不同的布局,我是一个非常喜欢学习的人,于是...

Vite 也可以模块联邦

sxkk20081年前92
Vite 也可以模块联邦
前言之前写过一篇文章,《将 React 应用迁移至 Vite》介绍了 Vite 的优势,并且和 webpack 做对比,但 webpack5 有个很重要的功能,就是模块联邦,那么什么是模块联邦?Vit...

2022 在微笑中成长

sxkk20081年前121
2022 在微笑中成长
哈喽,大家好, 我是Ai知识分享,2022 年不知不觉已经过半了,看到朋友圈关于年中总结的文章,一时间不知道该如何写起,有的升 P8 了,有的拿到了新 offer,去了新公司,有的因疫情遭裁员,开始创...

30+ 图片压缩工具集合,包含在线压缩和CLI工具

sxkk20081年前71

Compressor.io 

Compressor.io 可以使用有损或无损压缩优化 JPEG、PNG、SVG、GIF 和 WebP,每个文件最高可达 10MB。如果要自定义压缩或使用较大的文件,则必须付费获得高级计划。在这种情况下,压缩图片在服务器端完成,因此将获得更快的结果。

Compressor.io

Imagecompresser.com 

Imagecompresser.com 允许同时上传多达 10 个文件,并支持 PNG、JPEG、WebP、JPG 和 GIF 格式。每个图像的文件大小没有任何限制,因此这可能适用于 10 个或更少的大文件。

Imagecompresser.com

许多开发人员花费了大量时间优化网页性能,比如优化 js、css、减少 http 请求等等,但减小图片大小产生的优化比其他所有领域加起来影响更大。WebUtils Bulk Image Compress...

【油猴脚本】在 Iconfont 上直接复制 React component 代码

sxkk20081年前67
【油猴脚本】在 Iconfont 上直接复制 React component 代码
本文接上一篇《如何在项目中管理你的图标?》Iconfont 和 SVG 优缺点对比在上文中介绍了使用 iconfont 的缺点,以及使用 SVG 的优点,简单归纳为以下几点:Icon 的缺点当网络不好...

前端妹子问我 position fixed 失效问题该如何解决?

sxkk20081年前95
背景这两天公司一位妹子问我,“我这边调试的时候本地显示没问题,到手机端就有问题,该怎么办呢?” 测试环境没问题到线上就有问题了?对此我也很纳闷。 下图是复现的效果图, 这个是一个用户选择组件,当点击按...

打字机效果的实现与应用

sxkk20081年前101
打字机效果的实现与应用
前言在 web 应用中,模拟编辑器或者模拟输入框中文字啪啦啪啦输入的效果,往往能够吸引人们的眼球,让用户的注意力聚焦在输入的内容上,其实使用的是 web 动画模拟打字机效果,本文将和大家探讨打字机效果...

Uniapp 实现全民分销功能

sxkk20081年前62

流程图

全民分销流程图

前言前段时间在掘金 app 多了一个推广中心,分享课程链接,若有其他用户从你分享的链接购买,你就可以获得一笔佣金,我们称类似的功能叫全民分销,全民分销在互联网推广中很常见,比如腾讯云、阿里云等都有,只...