木头的博客

我是木头 有些想法 有点精力

0%

发表于 分类于

简介

testcafe (官网) 是一个基于 nodejs 的自动化测试框架，优点就先不多说了，我们直接进入正题！

安装

testcafe 是一个 npm 包，它可以使用 npm 或 yarn 包管理器进行安装，这里我们使用 yarn 进行安装（因为它很快）

如果你的机器上没有安装 yarn，那么你可以使用 npm 来安装 yarn 😊

1
npm install -g yarn

在命令行中运行以下命令

1
yarn global add testcafe

这样， testcafe 就安装在你本机上啦

小试牛刀

创建一个测试项目

我们新建一个目录，用于练习我们的自动化测试框架 testcafe

1
2
3
# 首先切换到你用于管理 web 项目的根目录，我本机是 "~/www"
cd ~/www
mkdir testcafe && cd testcafe
阅读全文 »

发表于 分类于

使用 Vue + Koa 打造全栈应用《时光·印象》图片分享应用 系列教程

前言

之前在学校用前端 pjax 无刷新跳转 + 后端 php 服务端渲染做了一个应用, 用来做校内的图片分享网站, 后来离校后就没怎么管了, 所以只做了一点就弃坑了.

最近又想起来那个项目, 所以这次抱着学习的心态使用 vue + koa 来重新将这个项目拾起来, 一方面可以学习一些当下的新框架了解前段发展趋势, 另一方面也可以充实下自己的简历.

选型

下面列出该项目的技术选型, 以及原因 (按重要程度排序)

  • Vue (v2.5) 单文件组件 响应式

    以及 vue-router vuex axios

    选 Vue 作为前端框架是因为他的单文件组件做模块化开发很方便, 还有现成的脚手架工具 vue-cli, 以及对 @尤大 的 信仰

  • Koa (v2.5) 中间件

    以及 koa-router koa-jwt

    选用 Koa 而非 Express 是因为 Express 了解过一些, 想换个口味试试. Express 也确实感受过回调地狱的痛, Koa 的洋葱模型似乎很不错!

    后端只用来提供 API 接口不做 SSR.

  • MySQL (v8.0) SQL Database

    常规的关系型数据库，深入学习一下 MySQL，为全栈发展打好坚实的基础

  • Eslint 语法检查 防傻瓜

    Eslint 进行代码风格检查和防傻瓜还是非常方便的, 尤其是配合其自带的 --fix 功能自动进行代码格式化. 避免在 coding 的过程中出现一些傻瓜式的语法错误带来的不必要的时间浪费.

    使用 Eslint Standard 配置（Vue 使用 @vue/standard 配置）

  • ES6, Stylus 语法糖 预处理

    语法糖! 提高 coding 效率. 但是 Stylus, 一个小众的 css 预处理器, 提供了非常高效和酷炫的写法.

  • Yarn 依赖安装

    用 Yarn 就是因为快! 比 npm 快了不是一丁半点! yarn 执行项目内 bin 文件也非常方便, 免去了安装全局依赖的烦恼.

阅读全文 »

发表于 分类于

tips: 解决办法在文章底部，请使用右侧导航直接跳转到 解决办法

问题描述

最近在使用 centos 7 时需要升级到 nodejs 10 版本，直接执行 yum update nodejs 发现 yum 源里还是 6.x，并且提示已经是最新版本了。。

？？什么鬼，去 nodesource 查看原来需要将 nodesource 源升级一下，so，执行以下命令

1
2
curl -sL https://rpm.nodesource.com/setup_10.x | bash -
yum upgrade nodejs

竟然发现还是 6.x 版本

1
2
3
4
5
6
7
8
====================================================================================================================
 Package               Arch                  Version                                Repository                 Size
====================================================================================================================
Installing:
 nodejs                x86_64                2:6.11.2-1nodesource                   nodesource                 17 M

Transaction Summary
====================================================================================================================

咦？难道是需要将 node 先卸载了吗？于是 yum remove nodejs 然后 yum install nodejs。。。然后是你猜到的结果，还还还还是 6.x 版本。。。

阅读全文 »

发表于 分类于

相信前端的同学们已经接触过栅格化布局了, 只要你用过 bootstrap 或者一些其他的 css 框架.

栅格化布局是一个非常方便的布局方式, 尤其是它的自适应布局, 可以根据屏幕大小缩放容器的宽度.

preview

今天我们用一个 css 预处理器 stylus 来编写一个 只有 50 行代码, 能自定义栅格数, 能响应多个断点, 能推能拉的栅格化布局!

阅读全文 »

发表于 分类于

前言

这里是一篇个人学习使用 Linux 操作系统时遇到的一些常见问题以及资料的集合. 用来在日后的操作中做一个 QA 索引. 如果它也能帮到你就再好不过了.

阅读全文 »

发表于 分类于

注意：无插件 Vim 笔记。个人使用 Vim 作为 tty 编辑器和辅助开发工具配合主力 IDE 使用（IDEA Vim、VSCode Vim），为了保证通用性与便捷性，本文无插件。

Vi 作为 Unix 系统自带的编辑器，流传至今是有一定道理的。在连接进远程服务器时，并不一定能够使用 GUI 进行操作，此时又一个趁手的编辑器就尤为重要了。

那是不是会进入编辑模式，能保存文件就够用了呢？哈哈，是的，但是 Vim 的强大完全可以作为日常编辑器使用，能极大的提升开发效率(是一种以大脑空间换时间的思路)，一起来看看吧！

阅读全文 »

发表于 分类于

使用技巧

现在的互联网都鼓励大家使用 Chrome 浏览器，它很强大，本身简洁，支持非常多的插件。但正因如此，大家都比较懒不愿意去花时间学习适应一个新的产品去打造适合自己的浏览器，所以我在这里写下一些使用 Chrome 浏览器的小技巧供大家参考学习。

搜索引擎相关

相信不少朋友不愿意使用 chrome 浏览器是因为它默认的搜索引擎是 google，而对于国内环境来说，普通用户不使用特别手段是上不了 google.com 的，所以你在地址栏输入向搜索的关键词时会跳转到 google 导致无法显示，从而必须先进入到 baidu.com 然后再进行搜索。

修改默认搜索引擎

那有没有简单的方法能够将 chrome 浏览器的默认搜索引擎切换为百度呢？当然有。

进入设置页面，找到 搜索引擎 一栏，将默认搜索引擎切换为百度即可

switch-search-engine

快捷切换搜索引擎

学到了上面的方法你还不满足，我想在多个搜索引擎中自由切换，比如搜技术类作品用 github，搜视频用 bilibili，搜百科用 wikipedia，搜地名用 map.baidu.com。

按照一般思路，搜百科用 wikipedia 的话要先去 zh.wikipedia.org，然后在该站点的搜索栏中键入要查询的关键字，总共两个步骤。

那我现在教你一个快捷的方法：直接在地址栏键入 wikipedia，然后按下 tab 键，会发现地址栏变成这样：（不过要保证你之前用过 wikipedia 的搜索功能）

阅读全文 »

发表于 分类于

自己在使用 git 的过程中遇到了不少问题, 最终我都会花时间把它们解决. 这里记录下我遇到这些场景时的解决办法, 并总结一下各种方法的优缺点, 让大家少走点弯路.

使用案例

正在做一个功能, 这时临时需要做别的修改

你可能会遇到这种情况: 当你正在做一个功能(feature-A)时, 这个功能并没有开发完, 但这时有同学喊你紧急修复一个线上 bug 或者要你 pull 一下代码. 这种情况下你会怎么做呢 ?

  • A.

    1
    2
    3
    4
    5
    6
    git add .               // 将当前改动提交至暂存区
    git commit -am "save"   // "保存"一下这些改动
    git checkout master     // 切换到 master 分支
    // some change commit
    git push origin master  // 修复完成后提交
    git checkout feature-A  // 切换回功能分支继续开发

  • B.

    1
    2
    3
    4
    5
    6
    7
    git add .
    git commit -am "temp"   // 临时"保存"一下这些改动, 因为我最后会撤销它
    git checkout master
    // some change commit
    git push origin master
    git checkout feature-A  // 切换回开发分支
    git reset --mixed HEAD^ // 撤销上一次提交并恢复工作区

  • C.

    1
    2
    3
    4
    5
    6
    git stash               // 存储工作区和暂存区
    git checkout master
    // some change commit
    git push origin master
    git checkout feature-A  // 切换回开发分支
    git stash pop           // 还原工作区和暂存区

正确姿势

C. 使用 git stash 功能

阅读全文 »

发表于 分类于

本文是针对小白的科普向文章, 我会尽量使用浅显通俗的语言, 让小白们尽可能看懂.

很多人有这样一个误区, 在使用电脑感觉比较 “卡” 时, 就想清理一下电脑里面的垃圾来加快运行速度. 但我到底该不该时常清除电脑中的 “垃圾” 呢? 换句话说, 清理 “垃圾” 真的能加速电脑运行吗?

下面我们简单介绍一下 “垃圾”, 如果你只想知道该不该清理, 直接跳到底部结论部分即可.

360中的垃圾清理

我使用 360 安全卫士 (版本 11.2) 的电脑清理功能为例, 列举电脑中的 “垃圾” 可以分为哪些类别.

阅读全文 »

发表于 分类于

写在前面: 应用推荐的相关文章其实一直想做, 因为我自己用的一些软件或应用都非常小众, 感觉很轻量 / 实用, 不像 360 全家桶那些应用浓重的商业气味. 这类软件知道的人不多, 介绍给朋友时他们总有种 “你哪来这么多有意思的软件啊!” 的感觉, 所以写下这个系列的文章, 让这类软件让更多的人知道, 支持作者, 支持优质应用 !

我先慢慢积累一些推荐, 后面我会做成一个应用小仓库之类的东西, 推荐一些小众的、轻量的、实用性非常高的应用程序。

阅读全文 »