在 React 组件中监听 android 手机物理返回/回退/back键事件

当前端页面嵌入到 webview 中运行时,有时会需要监听手机的物理返回按键事件来做一些自定义的操作。

比如我最近遇到的,在一个页面里面有批量选择的功能,当点击手机的返回键时,清除页面上的选中状态。我采取的办法如下:

继续阅读“在 React 组件中监听 android 手机物理返回/回退/back键事件”

linux命令行及shell脚本学习笔记之构建基本脚本

shell脚本的关键在于输入多个命令并处理每个命令的结果,甚至需要将一个命令的结果传给另一个命令。shell可以让你将多个命令串起来,一次执行完成。如果要两个命令一起运行,可以 把它们放在同一行中,彼此间用分号隔开。

创建shell脚本文件

在创建shell脚本文件时,必须在文件的第一行指定要使用的shell。其格式为:

#!/bin/bash

在通常的shell脚本中,井号(#)用作注释行。shell并不会处理shell脚本中的注释行。然而, shell脚本文件的第一行是个例外,#后面的!会告诉shell用哪个shell来运行脚本

继续阅读“linux命令行及shell脚本学习笔记之构建基本脚本”

linux命令行及shell脚本学习笔记之环境变量

shell的父子关系

用于登录某个虚拟控制器终端或在GUI中运行终端仿真器时所启动的默认的交互shell,是一 个父shell。命令行输入bash就会创建一个子shell。

使用 ps –forest 命令可以查看

一行中输入多条命令使用分号; 即可例如 pwd ; ls ; cd /etc ; pwd ; cd ; pwd ; ls

进程列表:(pwd ; ls ; cd /etc ; pwd ; cd ; pwd ; ls),生成子shell

继续阅读“linux命令行及shell脚本学习笔记之环境变量”

linux命令行及shell脚本学习笔记之常用命令

常用命令

1.创建文件和列出文件

touch filename // 创建空文件
ls -l < 过滤文件名>  // 问号(?)代表一个字符 星号(*)代表零个或多个字符
ls -l --time=atime  // 显示文件的访问时间

2.复制文件

cp source destination // source和destination都是文件名时,复制了一个新文件
cp -R 目录名/  新目录 // -R 参数递归复制目录下的所有文件

3.链接文件 继续阅读“linux命令行及shell脚本学习笔记之常用命令”

linux命令行及shell脚本学习笔记之linux初识

参考书籍:《Linux命令行与shell脚本编程大全》

Linux基础知识

Linux可以分为四个部分:

 

内核:

主要负责以下四种功能:

  • 系统内存管理
  • 软件程序管理
  • 硬件设备管理
  • 文件系统管理

内存存储单元按组划分成很多块,这些块称作页面(page)

Linux操作系统将运行中的程序称为进程

内核创建了第一个进程(称为init进程)来启动系统上所有其他进程 继续阅读“linux命令行及shell脚本学习笔记之linux初识”

使用puppeteer爬取网页数据实践小结

简单介绍Puppeteer

Puppeteer是一个Node库,它通过DevTools协议提供高级API来控制Chrome或Chromium。Puppeteer默认以无头方式运行,但可以配置为有头方式运行。Puppeteer中文”木偶”,很贴切,它可以使用node程序来模拟人操作浏览器的行为,比如点击某个按钮等。

Puppeteer可以做什么

在浏览器中手动执行的大多数操作都可以使用Puppeteer完成!例如:

  • 生成页面的屏幕截图和PDF。
  • 抓取SPA(单页面应用程序)并生成预渲染内容(即“SSR”(服务器端渲染))。
  • 自动化表单提交,UI测试,键盘输入等。
  • 创建最新的自动化测试环境。使用最新的JavaScript和浏览器功能直接在最新版本的Chrome中运行测试。
  • 捕获时间线跟踪 您的网站,以帮助诊断性能问题。
  • 测试Chrome扩展程序。

继续阅读“使用puppeteer爬取网页数据实践小结”

React服务器端渲染框架next.js项目实战及部署上下文context问题解决办法

在前段时间折腾过搭建react服务器端项目架构,点击这里了解下,正好最近有个重构PC网站的需求,考虑SEO等因素。在做技术选型的时候决定采用nextjs。项目开发过程中,nextjs的体验非常棒,个人觉得比create-react-app开发体验还要好,特别是HMR功能,虽然都有这个功能,但是nextjs做的更好一些。CRA里面修改了代码,格式化了文档,会导致整个页面刷新,这对于SPA项目的开发体验就很不好了。我在使用nextjs的开发过程中,如果不是自己主动去刷新浏览器,几乎就没有刷新过整个页面,所有的修改都是在不刷新页面的前提下就反映到了页面上,这个体验真的很棒。 继续阅读“React服务器端渲染框架next.js项目实战及部署上下文context问题解决办法”

自己动手搭建react-ssr服务器端渲染项目架构

最近折腾了下React的ssr项目的搭建,之前折腾过一次没有太多的进展。这次重新开始搭建react的项目架构。项目源码:https://github.com/rt-zhangxuefei/react-ssr-template

特别感谢:慕课网的Delllee的课程。这里我使用了saga代替thunk,中间也遇到了一些坑,中间层代理使用了http-proxy-middleware。文章记录我搭建过程中遇到的一些问题:

继续阅读“自己动手搭建react-ssr服务器端渲染项目架构”