- 😄 前端开发工程师
- 🏡 作品:达达前端 | 求星星 ✨
- 🌱 热爱分享 1024bibi.com
- 😺 趣讲技术:掘金 魔王哪吒 | infoQ : infoQ 魔王哪吒
- 💬 微信:xiaoda0423
- 🤔 有问题欢迎私聊
- 👬 QQ 千人编程交流群2:634382181
- 💬 向我询问:如有问题可以点击(Ask me about)
- 📫 如何联系我wx: xiaoda0423(How to reach me)
- ⚡ 有趣的事实: 我一直在倡导学习(Fun fact)
WebFamily 【每日学习打卡come on】一份涵盖大部分Web前端开发程序员所需要掌握的核心知识。前端技术博客仓库,Vue 源码解析,React 深度实践,TypeScript 进阶艺术,工程化,性能优化实践…… Leetcode 【Suggest 👍 💻 Leetcode brush question & answers】leetcode题解,记录自己的leetcode解题之路……
网站流量统计之UV(Unique Visitor):
独立访客,将每个独立上网电脑(以cookie为依据)视为一位访客,一天之内(00:00-24:00),访问您网站的访客数量。一天之内相同cookie的访问只被计算1次。
网站流量统计之PV(Page View):
访问量,即页面浏览量或者点击量,用户每次对网站的访问均被记录1次。用户对同一页面的多次访问,访问量值累计
网站流量统计之IP:
指独立IP数。00:00-24:00内相同IP地址只被计算一次,做网站优化的朋友最关心这个。
网站流量统计之人均PV:
指选择时间范围内,每个访客访问网站的PV数,网站优化的终极目标!
IP质量:
根据人均PV的数值来评价某个来源、某个关键字、某个访客的质量和价值。通过对互联网数据的大量统计,确定了评判IP质量的准确的依据。人均PV越高,IP质量就越好,也就表明该来源下访客的忠诚度越好。
已阅
vue实现预览功能(包括doc,pdf,图片,视频)https://www.cnblogs.com/lhy-555/p/10839750.html
2021.8.9
2021.7.28
- vue-cli打包配置不同的开发和生成环境
- vue中有关.env;.env.development,.env.production的相关介绍
- vue el-upload上传控件一直报跨域问题 post请求变成get请求
2021.7.22
2021.7.21
2021.7.18
2021.7.15
- 项目基础配置使用 vue-cli2 生成
- 自适应方案核心: 阿里可伸缩布局方案 lib-flexible
- px转rem:px2rem,它有webpack的loader px2rem
2021.7.14
2021.7.13
2021.7.12
2021.7.8
- Compilation issue with newer version of SASS
- Sass: DEPRECATION WARNING: Using / for division is deprecated and will be removed in Dart Sass 2.0.0 #4751
- Does not work with Vue 2.5.18
- vue版本依赖包([email protected] ) ([email protected])不匹配问题
- Unable to resolve signature of class decorator when called as an expression
2021.7.5
- vue-cli3.0 吃过的坑
- vue中watch高级用法(deep和immediate)
- Vue.js中 watch(深度监听)的最易懂的解释
- 通过配置 VS Code 来提高生产力
- Vue ts 中的@watch,@ prop的用法
2021.7.1
2021.6.30
- 使用Vue脚手架构建项目时Runtime + Compiler和Runtime-only的区别
- vue init webpack Travel bash: vue: command not found
- Vue中 Runtime + Compiler 和 Runtime-only 两种模式含义和区别
- vue脚手架搭建项目
- yarn 环境安装依赖报错解决方法(info [email protected]: The platform “win32“ is incompatible with this module.)
- npm install报错(The platform “win32“ is incompatible with this module)
- 记一次npm安装依赖奇怪的gyp报python错误
- npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):
- vue-property-decorator用法
2021.6.29
- 项目中使用package-lock.json锁版本问题
- Nuxtjs vuetify 抛出大量
Using / for Division 已弃用,将在 Dart Sass 2.0.0 中删除。
- Semver:波浪号和插入符号
- Using / for division is deprecated and will be removed in Dart Sass 2.0.0.
Languages and Tools:
These are some of the technologies and tools that I work with:
【web面试+web学习指南】
一份涵盖大部分Web前端开发程序员所需要掌握的核心知识,是一个为开发者提供免费的学习资源整合社区。
哪吒人生信条:如果你所学的东西 处于喜欢 才会有强大的动力支撑。
我会认真去写这个系列,很多细节的点,可能想得不是很完善,大家可以去【公众号】(程序员哆啦A梦)获取或者加我【微信】提意见(别忘记Star哟)。
技术交流群:添加我微信 xiaoda0423 备注【姓名-工作年限/学校】即可
- 两数之和,有效的括号,两数相加
- 合并两个有序链表,删除排序数组中的重复项,JavaScript笔记
- 力扣 (LeetCode)-最大子序和,JavaScript数据结构与算法(数组)
- 力扣 (LeetCode)-栈,括号生成 |刷题打卡
- 力扣 (LeetCode)-加一,队列 |刷题打卡
- 力扣 (LeetCode)-合并两个有序数组,字典,散列表|刷题打卡
- 力扣 (LeetCode)-对称二叉树,树|刷题打卡
- 力扣 (LeetCode)-104. 二叉树的最大深度,图|刷题打卡
- 排序,搜索,算法模式,算法复杂度 | 数据结构与算法综合笔记
- 力扣 (LeetCode)-28. 实现 strStr()
- 力扣 (LeetCode)-14. 最长公共前缀
- 力扣 (LeetCode)-13. 罗马数字转整数
- 一个合格的中级前端工程师需要掌握的技能笔记(中)
- 一个合格的中级前端工程师需要掌握的技能笔记(上)
- 已阅冴羽大佬文章
- 前端日常总结
- 一份不可多得的TypeScript系统入门整理
- JS葵花宝典秘籍笔记,为你保驾护航金三银四
- TypeScript趁早学习提高职场竞争力
- 前端模拟面试字数过23477万内容
- JavaScript数据结构之链表 | 技术点评
- JavaScript的数据结构-集合 |技术点评
- 这是我的第一次JavaScript初级技巧
- 一个合格的初级前端工程师需要掌握的模块笔记
- 【初级】个人分享Vue前端开发教程笔记
- localStorage和sessionStorage本地存储
- HTML5中的拖放功能
- 挑战前端知识点HTTP/ECMAScript
- 前端170面试题+答案学习整理(良心制作)
- 必学必会-音频和视频
- 前端HTML5面试官和应试者一问一答
- Vue.js笔试题解决业务中常见问题
- 前端面试必备ES6全方位总结
- 考前复习必备MySQL数据库(关系型数据库管理系统)
- 长篇总结之JavaScript,巩固前端基础
- 学习总结之HTML5剑指前端(建议收藏,图文并茂)
- 前端必学必会-多媒体-本地存储-浏览器与服务器的交互-通信功能
- 【建议👍】记录一次BAT一线互联网公司前端JavaScript面试
- Web页面制作基础
- 【思维导图】前端开发-巩固你的JavaScript知识体系
- 【图文并茂,点赞收藏哦!】重学巩固你的Vuejs知识体系
- 【高能笔记】如何获得令人心动的前端offer | 掘金技术征文
- 11期前端冲刺必备指南-执行上下文/作用域链/闭包/一等公民
- 12期前端冲刺必备指南-HTTP/HTTPS/HTTP2/DNS/TCP/经典题
- 13期前端冲刺必备指南-this/call/apply/bind(万字长文)
- 14期-连肝7个晚上,总结了计算机网络的知识点!(共66条)
- 熬夜总结了 “HTML5画布” 的知识点(共10条)
- 16期-熬夜7天,我总结了JavaScript与ES的25个重要知识点!
- 17期-什么是MySQL数据库?看这一篇干货文章就够了!
- 18期-后端逆袭,一份不可多得的PHP学习指南
- 19期-当你在百度搜索关键字的时候,哪个网站会排在最前面?今天给大家科普一下“网站SEO”
- 前端学习总结,经验分享,项目经验分享过程 | 掘金技术征文-双节特别篇
- 写给前端程序员的英文学习指南 | 掘金技术征文-双节特别篇
- 【图文并茂,点赞收藏哦!】重学巩固你的Vuejs知识体系(上)
- 【图文并茂,点赞收藏哦!】重学巩固你的Vuejs知识体系(下)
- 【思维导图】前端开发JavaScript-巩固你的JavaScript知识体系
- (一)熟练HTML5+CSS3,每天复习一遍
- 面试官一上来就问我Chrome底层原理和HTTP协议(万字长文)
- 2020 年「我与技术面试那些事儿」| 掘金年度征文
- 【进阶】面试官问我Chrome浏览器的渲染原理(6000字长文)| 掘金年度征文
- 2020年小程序开发-云开发技术总结 | 掘金年度征文
- 腾讯位置服务开发应用 | 创作者训练营
- 达达前端个人web分享92道JavaScript面试题附加回答 | 创作者训练营
- 【这一年收到的书籍,感谢赠予!】一起回顾 2020,展望 2021 | 掘金年度征文
- 哪吒闹海,席卷图文学习前端Flex布局-七日打卡
- 针对CSS说一说|技术点评
- 原来也没有那么难!Vue商城开发 | 技术点评
Vue.js 前端框架 https://vuejs.org/
Vue-router 路由框架 https://router.vuejs.org/
Vuex 全局状态管理框架 https://vuex.vuejs.org/
Nuxt.js 创建服务端渲染 (SSR) 应用 https://zh.nuxtjs.org/
Element 前端ui框架 https://element.eleme.io
Axios 前端HTTP框架 https://github.com/axios/axios
Echarts 图表框架 www.echartsjs.com
CKEditor 富文本编辑器 https://ckeditor.com/
Highlight.js 代码语法高亮插件 https://github.com/highlightjs/highlight.js
Vditor Markdown编辑器 https://github.com/Vanessa219/vditor
vue-cropper 图片裁剪组件 https://github.com/xyxiao001/vue-cropper
vue-image-crop-upload vue图片剪裁上传组件 https://github.com/dai-siki/vue-image-crop-upload
vue-emoji-comment Vue Emoji表情评论组件 https://github.com/pppercyWang/vue-emoji-comment
clipboard.js 现代化的拷贝文字 http://www.clipboardjs.cn/
js-beautify 美化JavaScript代码 https://github.com/beautify-web/js-beautify
FileSaver.js 保存文件在客户端 https://github.com/eligrey/FileSaver.js
SortableJS 功能强大的JavaScript 拖拽库 http://www.sortablejs.com/
vue-side-catalog 目录导航栏 https://github.com/yaowei9363/vue-side-catalog
uniapp 移动端跨平台语言 https://uniapp.dcloud.io/
colorUi 专注视觉的小程序组件库 https://github.com/weilanwl/ColorUI
showdown 用Javascript编写的Markdown 到Html转换器 https://github.com/showdownjs/showdown
turndown 用JavaScript编写的HTML到Markdown转换器 https://github.com/domchristie/turndown
- webpack - 打包项目。
- rollup - 打包 npm 库。
- parcel - webpack 竞品,但发展前景不乐观,再观察一段时间。
- systemjs - 针对一些特殊场景会比较有用,比如云 ide,支付宝小程序 IDE 等。
- microbundle - 基于 rollup,简化配置。
- bili - 基于 rollup,同上。
- father - 组件打包工具,提供 babel 和 rollup 两种打包方式。
- vue-cli - vue 命令行工具。
- create-react-app - react 官方脚手架。
- prepack - 通过预先执行的方式优化打包结果。
- lebab - 把 es5 代码转成 es6,反向 babel。
- esm-to-cjs - 把 esm 转成 cjs。
- tsdx - Zero-config CLI for TypeScript package development.
- webpack-dev-server - webpack 开发服务器。
- webpack-dev-middleware - webpack 中间件。
- webpack-merge - 合并 webpack 配置。
- webpack-chain - 通过 chain 风格 api 的方式修改 webpack 配置。
- svgr - svg 转 react 组件。
- postcss - CSS 界的 babel。
- autoprefixer - 为 CSS 选择权自动加 prefix。
- cssnano - CSS 压缩,也有类 preset 的概念。
- mini-css-extract-plugin - 提取 CSS 为单独文件。
- webpackbar - webpack 进度条。
- webpack-bundle-analyzer - 构建产物占比分析。
- uglifyjs-webpack-plugin - JS 压缩,产物为 ES5 语法。
- terser-webpack-plugin - JS 压缩,产物为 ES6 语法。
- webpack-manifest-plugin - 生成 manifest.json。
- copy-webpack-plugin - 复制额外的文件到输出目录。
- case-sensitive-paths-webpack-plugin - 大小写敏感检测,能规避一些问题,但构建时性能消耗较大。
- css-hot-loader - CSS 热更新,搭配 mini-css-extract-plugin 使用。
- duplicate-package-checker-webpack-plugin - 重复依赖检测。
- fork-ts-checker-webpack-plugin - ts 语法检测。
- speed-measure-webpack-plugin - 统计 webpack 各阶段耗时。
- next.js
- nuxt.js
- gastby
- umi - 蚂蚁金服的前端框架
- rekit - IDE and toolkit for building scalable web applications with React, Redux and React-router.
- choo - dva 最初的 API 是参考这个实现的,已经不怎么发展了,再关注一段时间。
- taro - 用 React 写小程序,适配微信和支付宝等。
- after.js
- mint - 提供了语言层方案的框架。
- quasar - 基于 vue,一套代码多处适用。
- preact - 轻量级 React 实现。
- inferno - 轻量级 React 实现。
- react-router - React 路由方案。
- reach-router - React 路由方案,较新,优势是可访问性。
- router5 - 通用的路由方案。
- react-loadable - 按需加载 react 组件。
- ant-design - 蚂蚁金服的 React UI 库。
- material-ui - UI 库。
- react-intl - React 的国际化方案。
- react-dnd - 拖拽实现。
- react-helmet - 修改 html 的 header 内容。
- react-jsonschema-form - A React component for building Web forms from JSON Schema.
- 使用 JavaScript,HTML 和 CSS 构建跨平台的桌面应用程序-Electron
- 使用 React 来创建 Android 和 iOS 的原生应用-React-Native
- 可以快速在iOS和Android上构建高质量的原生用户界面-Flutter
- uni-app 是一个使用 Vue.js 开发所有前端应用的框架-UniApp
- 企业级产品设计体系,创造高效愉悦的工作体验-Ant-Design
- 为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库-Element-UI
- 源自谷歌,Build beautiful products, faster-Material Design
- 一个轻量、可靠的移动端 Vue 组件库,源自有赞-Vant
- babel
- babel-plugin-dynamic-import-node - 有些场景下会需要禁用
import()
语法。 - babel-plugin-macros - 前端文件写 node 逻辑。
- babel-plugin-rawest - React 的 DOM 直出方案。
- babel-plugin-react-require - 自动为 jsx 语法加 react 引用。
- babel-plugin-transform-react-remove-prop-types - 删除 prop-types,生产环境用。
- 一个开源的实时错误追踪系统(涵盖所有语言)-Sentry
- Your Form,这才是你想要的Form解决方案-UForm
- 一款运行在浏览器中的3D引擎,你可以用它创建各种三维场景-three.js
- react虚拟列表通用库,解决react中的长列表性能问题-react-window
- 前端目前使用最广泛的对ajax请求封装的库-axios
- 基于 redux、redux-saga 和 react-router 的轻量级前端框架-dva
- 一个用于现代JavaScript应用程序的静态模块打包工具-webpack
- Bridging Every Blockchain in a Multi-Chain Future-Vite
- 一个极速零配置、成熟的Web应用打包工具-parcel
- 将开发流程中让人痛苦或耗时的任务自动化,创造更大价值-gulp
- 应用最广泛的react脚手架,一键生成项目模板,生态成熟-create-react-app
- 一个应用广泛可插拔的企业级React应用框架-umi
- Vue.js开发的标准工具,目前应用最广泛的Vue脚手架-vue-cli
- 从零开始学前端 - HTML
- 从零开始学前端 - CSS
- 从零开始学前端 - JavaScript
- 运行在服务端的 JavaScript
- 深入理解 TypeScript
- ECMAScript 6 入门
- 算法系统学习
- TCP通信协议
- linux系统的系统学习
- 一款运行在浏览器中的3D引擎,你可以用它创建各种三维场景
- 一个基于 JavaScript 的开源可视化图表库
- 兼容 IE6+、完美支持移动端、方便快捷的交互性图表库
- 企业中后台的可视化解决方案(阿里通用图表组件库)
- 最流行的可视化库之一,它被很多其他的表格插件所使用
- 一套基于可视化编码的图形语法,以数据驱动
- 蚂蚁集团全新一代数据可视化解决方案(让数据栩栩如生)
web前端工作内容都有哪些? 需要再次进步需要学习什么? 就来讲述一下web前端工作者的工作内容。
职责一:
1、结合页面和系统功能,完成桌面或移动端页面/微信H5/小程序的开发、调试等工作,高效、高质地完成代码编写,确保符合前端代码规范;
2、与后端开发团队紧密配合,完成接口对接,确保前后端有效交互;
3、综合运用客户端和服务器端构建与优化方案、模块化开发等手段,提升开发效率和系统性能;
4、了解并结合业务需求,设计满足用户需要、符合用户习惯、运用大数据分析能力、体现大数据特色的系统。
职责二:
1、根据业务需求,完成产品的前端页面及交互实现;
2、对现有前端开发框架进行深入了解,并参与持续改进;
3、通过开发工具、改进流程,保证前端业务开发的高效性;
4、关注前端技术前沿,及时把新技术转化为业务开发中的生产力;
5、完成业务界面交互和独自设计组件开发。
职责三:
1、根据项目或者产品需求负责实现PC端及移动页面的设计和开发;
2、持续优化前端应用,改善用户交互以及视觉,保证前端网页的兼容性以及页面响应速度并负责前端代码的维护,
3、配合后台开发人员共同完成项目或者产品;
4、负责前端开发文档的编写;
职责四:
1、 根据产品经理和UX/UI设计的关键需求进行前端架构设计工作;
2、 承担前端核心模块的设计、实现工作;
3、 承担主要开发工作,对代码质量及进度负责;
4、 参与进行关键技术验证以及技术架构选型工作;
5、 和产品经理和UE设计师沟通并确定产品开发需求;
6、 与后台开发工程师配合,完成开发任务和上线。
若内容有做得不到位的地方,请及时联系我们进行整改即可,会在第一时间进行处理。
如果有疑问或者发现错误,可以在相应的 issues 进行提问或勘误。
如果喜欢或者有所启发,欢迎 star,对作者也是一种鼓励。
- 如果您对本项目有任何建议或发现文中内容有误的,欢迎提交 issues 进行指正。
- 对于文中我没有涉及到知识点,欢迎提交 PR。
- 如果您有文章推荐请以 markdown 格式到邮箱
[email protected]
。
所有文章采用知识共享署名-非商业性使用-相同方式共享 3.0 **大陆许可协议进行许可。