文章库ARTICLE COLUMN

  • 前端开发环境如何搭建

    前端开发环境如何搭建

    1、node环境与开发工具准备前端工程化开发,本地启动开发环境都是基于nodejs的,命令行里输入指令node -v可以帮助确认您的电脑上是否安装了node,如果没有安装,则可以去 node官网 下载安装包,如下图所示: 不管是在windows还是在mac环境下,都是一键傻瓜式...

    社区管理员社区管理员 评论0 收藏0
  • Docker怎么安装Mariadb

    Docker怎么安装Mariadb

    使用docker安装Mariadb过程中出现了很多问题,这里汇总下启动环境 centos7一、使用docker-compose启动1、数据库配置文件新建mysql/my.cnf文件,作为mysql的配置文件skip-name-resolveuser=mysql#user为root,会导致下面的报错character-set-server=utf8defaul...

    社区管理员社区管理员 评论0 收藏0
  • Github CICD自动化部署

    Github CICD自动化部署

    一、什么是CICD翻译过来就是持续构建、持续部署,在软件工程中,一个项目的迭代往往是很频繁的,每次都要重新部署,就成了一件很繁琐的事情,那么如何保证项目能够持续的构建和部署呢?我们先来看一个软件的开发流水线一般为:需求设计:软件需求分析和设计开...

    社区管理员社区管理员 评论0 收藏0
  • 如何开发JS-SDK

    如何开发JS-SDK

    一、前言最近在开发一款一键登录的号码认证js-sdk,所以就做了一些调研,记录下开发过程。前端SDK是什么?前端SDK是为了帮助前端实现特定需求,而向开发者暴露的一些JS-API的集合,规范的SDK包括若干API实现、说明文档等前端SDK其实很常见了,比如:UI组件库...

    社区管理员社区管理员 评论0 收藏0
  • 如何搭建CLI脚手架

    如何搭建CLI脚手架

    一、CLI有啥用,认识CLI前端开发过程中常见的CLI有:create-react-appvue-cliwebpack-cliprettier-cli基本复杂一点的工具都在集成CLI,为啥都要搞成CLI呢?因为CLI可以提供更强大的功能:通过命令搭配实现不同的功能管理项目模版启动本地服务生成模版文件对代...

    社区管理员社区管理员 评论0 收藏0
  • 微前端qiankun安装使用

    微前端qiankun安装使用

    一、前言大型中后台项目一般包括10个以上的子项目,如果维护在一个单页面应用中,项目就会越来越大,而且不利于版本的迭代,微前端就很好的解决了这些问题。这篇文章主要来体验下蚂蚁的微前端:qiankun,虽然比较成熟了,但在体验过程中还是有一些问题,记录...

    社区管理员社区管理员 评论0 收藏0
  • 同源策略

    同源策略

    一、浏览器安全无风险的世界不存在,包括浏览器,我们知道Web世界是开放的,包容的。但是开放和风险是对立的。Web 世界会是开放的,任何资源都可以接入其中,我们的网站可以加载并执行别人网站的脚本文件、图片、音频 / 视频等资源,甚至可以下载其他站点的可...

    社区管理员社区管理员 评论0 收藏0
  • CSRF攻击

    CSRF攻击

    一、什么是CSRF攻击我们常常听到这样一句话:默认的链接不要点,那些年也听过,邮箱中的垃圾链接不要点。 因为可能是黑客发起的CSRF攻击,所以在点击之前最好是确认链接的安全性。CSRF(Cross-site requests forgery)中文名:跨站脚本伪造简单的理解就是,黑...

    社区管理员社区管理员 评论0 收藏0
  • XSS攻击实践

    XSS攻击实践

    一、前言由于浏览器同源策略,限制了页面无法引用第三方资源,无法请求不同源下面的资源,影响了web的发展,所以浏览器出让了一些安全策略来满足web的发展。通过CSP安全策略来保证浏览器可以安全的加载第三方资源;通过CORS允许浏览器跨域请求;通过PostMessa...

    社区管理员社区管理员 评论0 收藏0
  • 使用Docker-compose打包整个网站项目一键部署

    使用Docker-compose打包整个网站项目一键部署

    一、前言我们常常见到很多比较棒的开源项目,但在本地安装运行的话就会很复杂,要配置不同的环境,安装不同的依赖,好一点的会用docker直接拉取,或者打包好。这些无疑都会增加初学者上手的成本,所以这篇文章总结了下目前比较常用的解决方法之一:使用docker...

    社区管理员社区管理员 评论0 收藏0
  • antd-Form4.x一个页面中多个表单处理

    antd-Form4.x一个页面中多个表单处理

    一、前言今天开发的时候,发现一个页面的表单其实是两个部分,其中一部分还在另一个页面引用了。这就增加代码量,所以优化下,为了重复使用这里的表单。如图,需求就是将下面两个表单拆开,可以重复使用,实际两部分可能有很多表单,这里方便起见,只写了三个...

    社区管理员社区管理员 评论0 收藏0
  • 构建一个后台管理系统要考虑哪些内容

    构建一个后台管理系统要考虑哪些内容

    一、前言昨天一个朋友问:我的工作只有vue、react,了解其他的好像没有太大作用。其实不然,前端要考虑的内容其实很多,不光是完成业务代码。我司的一个控制台前端维护人数在20+,如果每个人都在一个项目中开发,那么每天就等着构建了,不仅容易出错,而且浪...

    社区管理员社区管理员 评论0 收藏0
  • react项目关于webpack配置修改

    react项目关于webpack配置修改

    一、前言通过CRA脚手架构建的项目,一般webpack配置是隐藏的,如果要修改,就要另外处理。想要修改webpack通常有两种方式通过插件去增加或覆盖webpack配置(方法一、方法二)或者释放项目中的webpack配置,使之可见,然后可以修改(方法三)本来CRA脚手架将we...

    社区管理员社区管理员 评论0 收藏0
  • 输入url到页面渲染页面的全过程

    输入url到页面渲染页面的全过程

    一、网站加载概述面试过程中,常常遇到这样一道面试题,输入URL到页面加载完毕,浏览器做了哪些工作?首先输入一个URL,你会看到浏览器上面的标签页出现了一个loading图标,开始时是逆时针旋转,接着顺时针旋转,当前页面消失,显示我们常说的空白页面,接着...

    社区管理员社区管理员 评论0 收藏0
  • 前端自动化部署-.gitlab-ci.yml配置

    前端自动化部署-.gitlab-ci.yml配置

    一、前言该过程中用到的技术栈git gitlab shell需要提前准备的内容一个项目myweb本机安装Git一个Gitlab仓库docker私有仓库gitlab runner(Gitlab-runner)公司的代码一般都保存在私有化部署的Gitlab,要使用Gitlab的CI/CD,需要Gitlab版本>8.0.0CI/CD虽然不难,...

    社区管理员社区管理员 评论0 收藏0
  • 前端自动部署 - Shell脚本

    前端自动部署 - Shell脚本

    前言前端部署服务器,需要经过打包、迁移、部署、回退操作,如果每次都手动处理,那么容易出错还浪费时间,自动化部署又比较复杂,那么选择shell脚本做自动化,也是一个不错的选择,具体实现如下:项目环境执行自动化构建的前端项目myweb项目通过命令构建测试...

    社区管理员社区管理员 评论0 收藏0
  • Gitlab CI/CD执行流程

    Gitlab CI/CD执行流程

    一、什么是CI/CDCI 持续集成CD 持续交付CI/CD就是在开发阶段,通过自动化发布,来频繁部署应用的一种方式二、为什么要配置CI/CD想象一下,一个项目的发布如果手动部署,需要的操作有:单元测试打包文件上传服务器等等如果每个过程都需要手动执行,每次都要保...

    社区管理员社区管理员 评论0 收藏0
  • React组件封装 - 实现水印功能

    React组件封装 - 实现水印功能

    背景:在开发移动端内部应用的时候,涉及安全问题,我们经常在企业微信或者图片上看到水印,防止信息被泄露,针对这次开发做个复盘,记录下。效果图如下: 一、实现原理1、首先用canvas绘制水印2、创建蒙层div,可以覆盖在页面上,并设置pointer-events:none...

    社区管理员社区管理员 评论0 收藏0
  • React组件封装 - 实现水印功能

    React组件封装 - 实现水印功能

    背景:在开发移动端内部应用的时候,涉及安全问题,我们经常在企业微信或者图片上看到水印,防止信息被泄露,针对这次开发做个复盘,记录下。效果图如下: 一、实现原理1、首先用canvas绘制水印2、创建蒙层div,可以覆盖在页面上,并设置pointer-events:none...

    社区管理员社区管理员 评论0 收藏0
  • 前端简单的灰度方案,使用nginx

    前端简单的灰度方案,使用nginx

    一、项目背景前端项目开发一个模块,上线前需要灰度一部分用户,实现一个临时的灰度方案。现有项目状况:一个前端项目1.0.0版本后端服务1.0.0版本后端灰度服务2.0.0版本一个域名解析到前端服务80、443端口前端通过nginx转发静态文件1、实现原理1、打包一份前...

    社区管理员社区管理员 评论0 收藏0
  • 前端项目中优化引入路径

    前端项目中优化引入路径

    现象:在前端开发中,发现项目中很多路径引入都是相对路径,出现很多类似importapifrom"../../../api/test"import*asapifrom"../../../api"复制代码这样会导致文件引用的时候,需要计算层级,拖慢开发速度,解决方法如下:对于经常使用的目录,可以采用别名的...

    社区管理员社区管理员 评论0 收藏0
  • 转换时间为东八区时间

    转换时间为东八区时间

    摘要:转为正常的时间格式年月日时分秒处理成为时间戳增加个小时,北京时间比时间多八个时区时间戳转为时间四位数年份月份为一月份月的某一天小时分钟秒其他方法调用就是要转的时间 formatTime(utc_datetime) { // 转...

    番茄西红柿番茄西红柿 评论0 收藏2637
  • 四年来Android面试大纲,作为一个Android程序员

    四年来Android面试大纲,作为一个Android程序员

    摘要:再附一部分架构面试视频讲解本文已被开源项目学习笔记总结移动架构视频大厂面试真题项目实战源码收录 Java反射(一)Java反射(二)Java反射(三)Java注解Java IO(一)Java IO(二)RandomAccessFileJava NIOJava异常...

    不知名网友不知名网友 评论0 收藏0
  • 解决双击点击问题 -- 短时间内只触发一次

    解决双击点击问题 -- 短时间内只触发一次

    摘要:写在文件夹中返回新的函数将和参数传给原函数页面中引用点击事件 throttle.js --> 写在utils文件夹中function throttle(fn, gapTime) { if (gapTime == null || gapTime == undefined) { gapTime = 1...

    番茄西红柿番茄西红柿 评论0 收藏2637
  • gif波浪图片引入和改变颜色

    gif波浪图片引入和改变颜色

    摘要:引入图片改变背景颜色 /* 引入图片 */ background: #3eae29 url(https://zhihuiyuanqu1.oss-cn-beijing.aliyuncs.com/wave.gif); /* 改变背景颜色 */ background-blend-mode: lighten; bac...

    番茄西红柿番茄西红柿 评论0 收藏2637
<