关注IMWeb前端社区公众号

  • 第一时间获得最新、最火的技术干货
  • 定期推送您所关注的专题文章
  • 和大牛们一起讨论前端技术
  • 获取IMWeb社区、前端相关的最新活动
热文 更多

  • 怎样让开源项目看起来“高大上”

    为了避免重复造轮子,我们往往会借助开源的项目实现一些功能。很多时候,选择使用哪一个开源项目就像选择男、女朋友一样,固然内在很重要,但是眼缘也很关键,只有看对了眼,才会进一步地了解。作为开源项目的开发者,当然是希望自己写出来的成果能被更多的人尝试使用,所以这篇文章主要谈一谈怎样让开源项目看起来“高大上”,从而让别人有使用的冲动。 首先要弄清楚一个问题:怎样的开源项目才算“高大上”呢?这里举出两个例子,一个是在 2017 年越来越火的前端框架 Vue [https://Github.com/vuejs/vue] ,还有一个是我所在团队大神 avwo 开源的 web 调试代理工具 whistle [https://Github.com/avwo/whistle] ,大家可以去他们的 Github 地址感受一下,下面展示一下他们 Readme 的开头部分: Vue Readme Head [https://user-gold-cdn.xitu.io/2018/1/28/1613d39637dd22df?w=945>amp;h=343>amp;f=jpeg>amp;s=68365]

  • [在线+源码]vue全家桶+Typescript开发一款习惯养成APP

    VUE-TS-DAILY 基于Vue.js的2.5.13版本和TypeScript编写的模仿原生应用的WebApp. 源码地址 [https://github.com/xiaomuzhu/vue-ts-daily] 欢迎star 项目演示地址 [http://day.xiaomuzhu.top/] 扫描二维码 [http://omrbgpqyl.bkt.clouddn.com/18-5-15/73469590.jpg] 建议直接添加到主屏幕(ios端体验差一些). [http://omrbgpqyl.bkt.clouddn.com/18-5-16/49737422.jpg] 前言 为什么做这个项目? 1. 学习vue全家桶,很长一段时间在用React。 2. 利用PWA技术来模仿原生应用,来探究PWA与原生的差异。 3. 作者声称2.5之后vue增强了对TS的支持,探究TS在vue中的支持情况。 那么为什么模仿一款"习惯养成APP"而不是饿了么、美团、头条等著名APP?

  • 小程序开发问题笔记

    本文作者:IMWeb 黎清龙 原文出处: IMWeb社区 [http://imweb.io/topic/5af02af598070a734d418d02] 未经同意,禁止转载 小程序开发问题笔记 最近从0开始,开发了【企鹅速算检查】小程序,在开发过程中遇到一堆的问(巨)题(坑),这里记录下来分享给大家。 背景 【企鹅速算检查】小程序主要功能是拍照,然后把图片通过人工智能识别出算术题,并判断正误,最后展示结果给到用户。 因此,这个小程序主要使用到的核心功能有:拍照, canvas 。 为什么要用到 canvas 呢?主要是因为结果的图片是通过原图和批改结果信息合成出来的,这个合成需要在小程序处理。 下面是结果页面的一个例子: [http://7tszky.com1.z0.glb.clouddn.com/Fi97LQI4rMJhgdfrjNsOodF8JemR] 项目使用 wepy 开发框架进行开发。 问题记录 WEPY 的 PAGE 实例不会被销毁 页面在加载的时候就会创建 wepy 的 page 实例对象,在页面离开,已经调用了 onUnload 的情况下,wepy 的 page

  • 面向前端的 Lottie & AE 动画手把手入门教学

    因为我一直比较关注 Web 领域的设计趋势, 很早之前就听很说了 Lottie 这个项目, 但是一直没时间和机会去尝试, 最近终于有时间机会于是尝试了一把, 在这里分享一下。 一. INTRO TO LOTTIE Lottie 是 Airbnb 开源的一个支持 Web、Android、iOS 以及 ReactNative等平台的动画库,它可以结合 AE 和 Bodymovin 来快速实现跨平台动画。 其实对于普通的动效和简单动画, 使用原生代码实现已经足够, Lottie 是为了 复杂动画 而生的, 下面来看几个 Lottie 实现的几个动画例子: [https://raw.githubusercontent.com/HuQingyang/lottie-demo/master/pic/1%20VYA3Hx-eO7qDCr0ONlIlhQ.gif] 这种复杂的动画, 如果需要手写代码来实现, 将会很繁琐且效率低下, 这正是 Lottie 大展身手的地方。

  • PWA之离线缓存(一)

    PWA是什么 PWA全称是Progressive Web Apps, 是一种渐进式增强 WEB 应用。 这里的渐进式增强是指无论用户用的是什么浏览器都能保证应用能正常工作。 PWA特性: * 渐进增强 : 能够让每一位用户使用,无论用户使用什么浏览器,因为它是始终以渐进增强为原则 * 可安装 : 可以像原生APP在主屏幕上留有图标。 * 离线缓存 :通过Service Worker使得 Web App 也可以做到像 Native App 那样可以离线使用、消息推送的功能。 * 安全性 : 通过 HTTPS 来提供服务来防止网络窥探,保证内容不被篡改。 PWA是应用一系列技术组成的集合, 其核心技术包括 App Manifest、Service Worker、Web Push等等。 SERVICE WORKER详解 SERVICE WORKER是什么? service worker是独立于当前页面的运行在浏览器后台进程的脚本。利用它,我们可以拦截页面请求,缓存文件。 使用service worker有几点注意: * 页面必须基于https

热问 更多

  • 赵鹏帆 17 天前

    如题:参考https://twitter.com/necolas/status/829128165314306048?utm_source=feweekly&utm_campaign=issue42&utm_medium=web PWA(做离线化的)目前有这么成熟吗? 这个是否也说明以Javascript为基础的全栈体系正在逐渐落地?

  • 大漠刀客 2018-01-13 17:42

    js高级程序设计里说 this 引用的是函数执行的环境对象, 下面foo()在window下执行,环境对象就是window? * function foo(){ * alert(this); * } * foo(); * 那么函数嵌套为什么也是[object Window]?比如下面的 * function foo(){ * function foo2(){ * alert(this); * } * foo2(); * } * foo(); 输出的还是window * function SpecialArray(){ * alert(this); * } * alert(this); * SpecialArray(); * var colors = new SpecialArray(); 弹出的依次是[object Window],[object Window],[object Object]?这里的Object又是什么情况

  • 络黎 2017-10-19 17:31

    请指出JavaScript宿主对象和原生对象的区别?