20190822 前端开发日报

那个三本的“家伙”自学前端五个月经历了什么?;打造vuecli3+element后台管理系统(三)优化路由和vuex仓库,给router和store分模块;面试被问到Vue?想进一步提升?那就停下来看一下吧;vue父子组件之间通信的十种方式;快速了解 React Hooks 原理;前端该如何准备数据结构和算法?;javascript中为什么我们不能直接使用export?;本地启动 Vue.js 打包之后的项目

  1. 那个三本的“家伙”自学前端五个月经历了什么? 标题中所说的那个“家伙”就是我,我就是小鹿,转眼间,从安卓转到前端这五个月,到孤身一人来到北京找实习,这期间我经历了什么?仔细回顾一下,想想有时候真的是不要命了,这五个月,有很多要和大家分享的,仔细回顾这五个月,也算是我大学四年最值得纪念的,也是最疯狂的,我们从回到五个月前时光说起。 迷茫期 就…
  2. 打造vuecli3+element后台管理系统(三)优化路由和vuex仓库,给router和store分模块 我们在做后台系统的时候,经常会有比较多的功能页面,每个页面或多或少都会有需要存储在vuex中的数据,一般情况下我们会在state下定义不同的object,但是当功能一多,全部字段和action、mutations都定义在一个文件里,难免会使文件变得很难维护。全部页面的路由都定义在一个路由文件里也会使文件代码变得比较多,后期维…
  3. 面试被问到Vue?想进一步提升?那就停下来看一下吧Vue作为最近最炙手可热的前端框架,其简单的入门方式和功能强大的API是其优点。而同时因为其API的多样性和丰富性,所以他的很多开发方式就和一切基于组件的React不同,如果没有对Vue的API(有一些甚至文档都没提…
  4. vue父子组件之间通信的十种方式 编写时间:2019-08-20 更新时间:2019-08-20 作者:鬼小妞 备注: 本文 转载 了 Vue.js 父子组件之间通信的十种方式 状态: 已完成、待整合 2019-08-20 这篇文章介绍了Vue.js 父子组件之间通信的十种方式,不管是初学者还是已经在用 Vue 的开发者都会有所收获。无可否认,现在无论大厂还是小…
  5. 快速了解 React Hooks 原理我们大部分 React 类组件可以保存状态,而函数组件不能? 并且类组件具有生命周期,而函数组件却不能?
  6. 前端该如何准备数据结构和算法?据我了解,前端程序员有相当一部分对“数据结构”和“算法”的基础概念都不是很清晰,这直接导致很多人在看到有关这部分的内容就会望而却步。
  7. javascript中为什么我们不能直接使用export?相信很多人最开始时都有过这样的疑问假如我的项目目录下有一个 index.html, index.js 于是我像这样写
  8. 本地启动 Vue.js 打包之后的项目 首先这里是 Vue.js 构建之后的代码,通常是产出 dist/ 目录,如: dist ├── favicon.ico ├── index.html ├── robots.txt └── static ├── css │ └── app.c5a945a32210cf54269cf07a007f46a7.css ├── fonts │ └── icomoon.731abad.woff ├── img │ └── a.a517b7d.png └── js …
  9. Webpack4配置之基础篇 WebPack可以看做是模块打包机:它做的事情是,分析你的项目结构,找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言(Scss,TypeScript等),并将其打包为合适的格式以供浏览器使用。 2. webpack核心概念 Entry:入口,Webpack 执行构建的第一步将从 Entry 开始,可抽象成输入。 Module:模块,在 W…
  10. javascript之作用域一(理解作用域) 网上关于JS的变量和作用域的文章有很多,但真正能讲清楚,能深入理解的文章很少。在阅读了很多人的文章以后,我决定综合起来,结合实际代码,会不断丰富提炼总结更新,希望能够以一个比较清楚完整的方式让大家真正理解。直接撸起袖子,开始干吧。 一、JavaScript 作用域 1. 作用域是可访问变量的集合 在 JavaScript …
  11. JavaScript数据结构之栈学习 什么是栈? 是一种遵从后进先出(LIFO)原则的有序集合。新添加的或待删除的元素都保存在栈的 末尾,称作栈顶,另一端就叫栈底。在栈里,新元素都靠近栈顶,旧元素都接近栈底(你可以想象成是一堆摞在一起的盘子)。栈通常是用在编程语言的编译器和内存中保存变量方法调用等 下面我们用JS实现一个栈 我们创建一…
  12. 用 ESLint 管理 JavaScript 的代码风格 安装全局 ESLint > npm i -g eslint 。 在项目根目录下放置文件 eslintrc.json 。 导航到项目根目录,在控制台中输入 eslint <js 文件路径> ,可以看到输出的问题,如果为空,那么就没有问题。 要检查项目下所有 js 文件,可以输入 eslint . 。 配置项目下的 ESLint 在项目下执行 > npm i…
  13. 前端物料中台建设我在上一篇的文章大BU级别的”前后端分离”实践中提出了我们当前的前端团队中存在一些问题以及解决思路,并且在其中详细地写出了统一视图服务的实现思路和收益。这篇文章主要写关于前端迭代及上下游协作效率我们是…
  14. Webpack4配置之高级篇 yarn add purify-css purifycss-webpack -D const glob = require(‘glob’) const PurifyCSSPlugin = require(‘purifycss-webpack’) // 去除无用的css plugins: 复制代码 …
  15. JAVASCRIPT OBJECTS ECMAscript 说明文档对这门语言的定义是“一门适于在宿主环境中执行计算及操作计算对象的面向对象的编程语言”。简单的说,JavaScript是一门面向对象(OO)的语言。 面向对象讲究的是专注于对象本身——它们的结构,它们互相间是如何影响的。本文是@堂主 对《Pro JavaScript with Mootools》一书的第三章 Object 部分的翻译…
  16. NestJs学习之旅(2)——控制器 欢迎持续关注 NestJs之旅 系列文章 MVC 说到控制器就不得不说经典的MVC架构。 MVC模式(Model–view–controller)是软件工程中的一种软件架构模式,把软件系统分为三个基本部分:模型(Model)、视图(View)和控制器(Controller)。 控制器(Controller)- 负责转发请求,对请求进行处理,…
  17. 用 JavaScript 编写基于 HTML 的数字推盘游戏的 AI 本文翻译自 JavaScript AI For An HTML Sliding Tiles Puzzle By Arnaldo Perez Castano 。 Sam Loud (1841 – 1911) 美国国际象棋手,智力游戏设计师,在1870年代发明了数字推盘游戏。这个游戏由 m 行 n 列的网格组成,每个格子可以是任何有规律的事物,比如数字,字母,图片等。 游戏的解答过程是将一个排布变成另…
  18. webpack动态导入文件报错的解决方法 在进行webpack搭建单页面应用时,使用到了vue-router,配置路由的过程中,出现import语法错误。针对此现象,我们一起来分析下。 路由配置的代码如下: const routes = [{ path: ‘/customer01’, name: ‘customer’, component: () => import(‘../../views/customer/Index.vue’) …
  19. 新的 React DevTools 发布我们很高兴地宣布推出 React 开发者工具的新版本,现在可以在 Chrome,Firefox和(Chromium)Edge 中使用!
  20. 状态管理之Vuex(快速上手) 单项数据流 vuex管理流程 状态管理应用包含三部分: state,驱动应用的数据源; view,以声明方式将 state 映射到视图; actions,响应在 view 上的用户输入导致的状态变化。 进入实战 在使用全局安装vue vue-cli 使用vue全家桶指令vu…
  21. javascript之观察者模式场景一: 当观察的数据对象发生变化时, 自动调用相应函数。比如 vue 的双向绑定;场景二: 每当调用对象里的某个方法时, 就会调用相应’访问’逻辑。比如给测试框架赋能的 spy 函数;
  22. Webpack3 代码分割 CommonsChunkPlugin 之前写过一篇 webpack4 SplitChunks实现代码分隔详解 ,最近项目中使用到大量的Webpack3,因为Webpack3和Webpack4代码分割大相径庭,今天恰巧看到一篇优质博客,故转发过来。原文地址详情见文章末尾。 hello ~ 亲爱的看官老爷们大家好 ~ 最近一直在学习 webpack 的相关知识。曾几何时我总觉得 webpack 的体系庞大而难…
  23. React基础(二)前一篇 React基础(一) 简单地了解了 React 的一些基本知识点,怎么搭建一个简单的 React 项目、怎么创建 React 元素、组件以及怎么给项目添加样式这些基础功能。下面,在通过一些示例来了解 React 中的事件处理、…

关注github前端日报 订阅精彩文章

前端日报栏目数据来自码农头条,每日分享互联网上热门的前端开发、移动开发、设计、资源和资讯等,为开发者提供动力,如果觉得内容对你有用,记得分享给你的小伙伴。进入码农头条查看更多


关注我

我的微信公众号:前端开发博客,在后台回复以下关键字可以获取资源。

  • 回复「小抄」,领取Vue、JavaScript 和 WebComponent 小抄 PDF
  • 回复「Vue脑图」获取 Vue 相关脑图
  • 回复「思维图」获取 JavaScript 相关思维图
  • 回复「简历」获取简历制作建议
  • 回复「简历模板」获取精选的简历模板
  • 回复「加群」进入500人前端精英群
  • 回复「电子书」下载我整理的大量前端资源,含面试、Vue实战项目、CSS和JavaScript电子书等。
  • 回复「知识点」下载高清JavaScript知识点图谱

每日分享有用的前端开发知识,加我微信:caibaojian89 交流