- 博客(57)
- 收藏
- 关注
RSS订阅
原创 宝塔面板使用docker+nginx+gunicorn部署Django项目实战教程
执行完这句命令后，静态资源会被收集到STATIC_ROOT所指定的目录中(如上图所示)，django-simpleui的相关样式文件也会被一并收集到static目录中。如过不执行此操作，项目部署成功上线后，将无法看到图片、css、js等静态资源。我们可以看到，docker容器中有两个正在运行的镜像，一个是nginx:latest，一个是app-web,并且app-web是通过gunicorn的方式部署的。接下来我们可以通过命令的方式查看项目是否成功运行中。执行完此行命令，就代表我们的项目部署成功了。
2024-04-19 14:06:29
798
1
原创 html+css+jquery实现一个优雅的分页条
/ 添加 currentPage 变量用于跟踪当前页码。// 当总页数大于1页时，添加省略号和中间页码。// 在当前页和最后一页之间添加省略号。// 返回生成的分页 HTML 字符串。// 在第一页和当前页之间添加省略号。// 初始化分页 HTML 字符串。// 更新 currentPage。// 初始化分页条，默认在第一页。// 生成 "上一页" 按钮。// 始终显示最后一页的页码。// 生成 "下一页" 按钮。// 始终显示第一页的页码。// 添加当前页附近的页码。
2024-04-21 18:04:14
698
原创 Docker+Uwsgi部署Django项目
在之前的文章中，已经给大家分享了在docker中使用django自带的命令部署项目，这篇文章主要讲解如何使用uwsgi部署。
2024-04-13 18:08:27
540
1
原创 解决CSS中鼠标移入到某个元素其子元素被遮挡的问题
我们在开发中经常遇到一种场景，就是给元素加提示信息，就是鼠标移入到盒子上面时，会出现提示信息这一功能，如果我们给盒子加了hover，当鼠标移入到盒子上时，让他往上移动5px，即transform: translateY(-5px), 同时还让提示信息展示出来，此时受到transform的影响，提示信息会被父盒子遮挡住。我们可以看到，我们给tooltip设置了z-index值为10，但是黑色提示信息依然被挡住了，原因时当hover时，执行了transform, 会改变元素的层级，
2024-04-12 10:30:24
540
原创 如何使用Docker部署Django项目?
docker ps该命令会列出正在运行的镜像，如过看到镜像列表中有刚刚部署上去的Django项目，就代表项目部署成功。至此，可以在浏览器中输入进行访问。
2024-04-10 13:31:01
406
原创 Grid布局
<!DOCTYPE html><html lang="zh-CN"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Flex布局和Grid布局</title> <style> * {
2024-03-18 15:10:39
1056
原创 JS实现漂浮广告案例
因此，每次调用时 x + speed * gox + "px" 的值都会被重新计算，并且赋给了 link.style.left，实际上是将计算后的结果赋给了 link 元素的 style.left 属性，这会导致元素的位置发生改变。同样的，如果 link 的顶部超过视口高度减去100像素（假设 link 的高度是100像素），（假设 link 的宽度是200像素），或者左侧偏移小于0，那么水平方向的移动方向将反转。这个move()函数是用来实现link元素的动画移动的。元素的垂直速度和方向。
2024-03-15 11:32:13
712
原创 JS高级进阶
JavaScript 进阶 - 第1节学习作用域、变量提升、闭包等语言特征，加深对 JavaScript 的理解，掌握变量赋值、函数声明的简洁语法，降低代码的冗余度。理解作用域对程序执行的影响能够分析程序执行的作用域范围理解闭包本质，利用闭包创建隔离作用域了解什么变量提升及函数提升掌握箭头函数、解析剩余参数等简洁语法作用域了解作用域对程序执行的影响及作用域链的查找机制，使用闭包函数创建隔离作用域避免全局变量污染。作用域（scope）规定了变量能够被访问的“范围”，离开了这个“范
2023-07-18 09:41:55
301
原创 在React中使用setState修改数组的值时，为什么不能使用数组的可变方法(push、unshift等)? 但在vue中可以
修改数组的值时，不推荐使用数组的可变方法（如push、unshift等）。这是因为React会对比新旧状态，在发现状态变化后，更新组件的渲染。但当你调用可变方法修改数组时，虽然数组已经被改变，来创建一个新数组，并将原有数组中所有元素放入其中（即展开），再将新的值推入新数组中。由于我们返回的是一个新对象，而不是直接引用旧对象，所以React能够正确地检测到状态变化并更新组件。方法从原数组中过滤掉要移除的元素，并返回一个新数组。最后，我们将这个新数组传递给。，React并不会察觉到这个变化，也就不会更新组件。
2023-04-15 12:44:31
1037
1
原创 React Hooks基础
Hooks 是什么为什么要有 Hooks问题：Hook 是什么?一个 Hook 就是一个特殊的函数，让你在函数组件中获取状态等 React 特性使用模式：函数组件 + Hooks特点：从名称上看，Hook 都以 use 开头// 触发时机：1 第一次渲染会执行 2 每次组件重新渲染都会再次执行 useEffect(() => {}) // 触发时机：只在组件第一次渲染时执行 useEffect(() => {
2023-04-15 12:16:03
413
原创 JavaScript中的20个小技巧
setInterval()是一个用于重复调用函数的内置函数。使用Array.find()方法可以快速查找数组中的一个对象。箭头函数用于定义并创建函数的常用方式。使用reduce()方法将对象数组转换为单个对象。使用Object.values()获取对象的值。使用字符串重复技巧可以将某个字符串重复多次。使用async/await来处理异步操作。使用对象解构可以快速创建变量并设置其值。
2023-04-05 20:29:04
340
原创 Java中==和equals的区别是什么？
在上面的例子中，equals()方法被重写来比较两个Person对象的name和age属性是否相等。因此，p1.equals(p2)返回true，虽然它们是不同的对象，但是它们的内容相同。在上面的例子中，str1和str2引用相同的字符串对象，因此str1 == str2返回true。然而，str3引用一个新的字符串对象，所以str1 == str3返回false。在Java中，equals()和==都可用于比较两个对象的值，但它们的作用不同。
2023-04-05 13:26:41
60
原创 原生JavaScript实现Tab栏切换案例
/ 获取被点击的Tab按钮的data-target属性值，即对应的Tab内容的data-tab属性值。// 遍历所有的Tab按钮，取消除了被点击的Tab按钮以外的所有按钮的active类名。// 遍历所有的Tab内容，隐藏除了被点击的Tab内容以外的所有内容。// 获取所有的Tab按钮和Tab内容。/* 设置当前Tab按钮的样式 *//* 设置Tab内容容器的样式 *//* 设置当前Tab内容的样式 *//* 设置Tab栏容器的样式 *//* 设置Tab按钮的样式 *//* 设置Tab内容的样式 */
2023-03-30 15:00:12
400
原创 前端工程师学习顺序推荐
了解其核心概念、API和开发方式。模块化开发：了解CommonJS、ESM和AMD等模块化规范，以及Webpack、Rollup等打包工具的使用。JavaScript：学习JavaScript的基础知识，包括变量、数据类型、流程控制、函数、面向对象等。测试：学习前端单元测试和集成测试的基本知识和工具，例如Jest、Mocha、Chai等。包管理工具：熟悉npm或yarn等常用的包管理工具，了解如何安装、使用和发布自己的包。性能优化：了解前端性能优化的方法和工具，例如CDN、缓存、懒加载、代码压缩等。
2023-03-27 15:23:46
1075
原创 Vue3相关的10个常见问题
答：在Vue3中，可以使用directive()方法创建自定义指令。import {});答：下面以一个最简单的计数器为例，首先编写一段js文件用于封装计数器的相关逻辑} return {这个逻辑很简单，它暴露了一个计数器 count 和一个用于增加计数器的函数 increment。接着，在组件中使用 setup 函数并调用useCountsetup() {const {return {} };
2023-03-27 14:56:08
599
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人