Write the Code. Change the World.

7月 17

Atom 插件

快捷键可以通过 cmd+shift+p 搜索得到。

  1. atom-beautify
    用来对代码进行格式化,让杂乱无章的代码瞬间变得有条理,我自己平常用的最多的就是格式化 JSON 字符串了,注意在格式化的时候必须先选定语言。

  2. atom-html-preview
    可以在 atom 里面预览HTML。快捷键
    默认快捷键: CTRL + P 调用,会和内置核心插件冲突(切换文件那个)
    修改版快捷键: CTRL + F12 (感觉方便使用且没有冲突的快捷键)
    修改自定义键盘映射文件:
    实时浏览器调用快捷键
    'atom-text-editor':
    'ctrl-F12':'atom-html-preview:toggle'
    atom 内置了 Dev Live Reload 这个插件;
    这个插件的作用就是重新加载所有样式和规则,
    有点类似 linux 的 source xx.sh 一样..即时生效。
    调用快捷键是 CTRL + SHIFT + ALT +R
    当然,关闭 atom 再开 atom 编辑器也能达到重新加载所有样式规则的效果……

  3. file-icons
    这个比较好,让atom更加美丽,会在文件前面给一个小图标,针对不同格式的文件有着很好的支持,atom 的文件图标再也不会那么单调了。

  4. markdown-preview-enhanced
    这个号称最全markdown插件,可算是集成了所有用得到的和用不到的功能,强大的有些许过分,有时候会造成写markdown的时候卡顿,由于暂时没有找到能够同步滑动的插件,就暂时使用了这个。更多设置可以参考作者的中文文档:https://shd101wyy.github.io/markdown-preview-enhanced/#/zh-cn/

  5. markdown-table-editor
    markdown中编辑表格的神器,只需要打一个 | 然后通过 table 和回车键就可以完成表格的编辑,比起自己写效率高到不知道哪里去了。

  6. pdf-view
    让你可以在Atom中直接查看pdf。

  7. filetype-color
    在标签栏不同格式文件显示不同的颜色的标题。

  8. minimap
    用过 Sublime Text 的友友们都知道有一个很实用的功能,就是内部编辑那里有一个小小的代码图,
    这货就是补全 Atom 这个功能的,支持高亮代码,还可控,具体看内部设置。

  9. autocomplete-plus
    自动补全工具。

  10. emmet
    代码补全速写。可以取官网看看http://docs.emmet.io/cheat-sheet/

  11. color-picker
    颜色拾取器。

  12. docblockr
    方便代码注释。

  13. activate-power-mode
    代码跳动效果。

  14. quick-highlight
    代码高亮。

  15. autocomplete-paths
    路径提示功能。

阅读全文 >>

7月 16

unbuntu 安装 php mongo 扩展的时候,遇到了 configure: error: Cannot find OpenSSL's libraries 这个错误。

怎么解决了,冥冥已经安装了呀。

sudo apt-get install openssl

可以找找看。

sudo find / -name libssl.so
# 你会发现存在 /usr/lib/x86_64-linux-gnu/libssl.so
# 初步判断它可能只会在 /usr/lib/ 下寻找 libssl.so 文件
sudo ln -s /usr/lib/x86_64-linux-gnu/libssl.so /usr/lib 
# 重新编译过

其他方法

https://stackoverflow.com/questions/40359817/litespeed-web-server-and-error-cannot-find-openssls-libraries

阅读全文 >>

7月 14

Laravel 小点滴

  1. {{ csrf_field() }} 可以使用 @csrf 来代替。

阅读全文 >>

7月 09

使用 Laravel 开发框架,官方推荐使用 Homestead 环境。那么,Homestead 环境怎么构成呢。 至少有下边四个部分。

  1. virtualBox 虚拟机盒子(容器)。当然,你可以使用 VMWare, Parallels, Hyper-V。

  2. vagrant 虚拟机管理工具。通过命令,就可以操控管理你的虚拟机。

  3. Homestead box。 虚拟机实体,也就是环境。

  4. Homestead yaml。 虚拟机实体配置文件。

下载安装

VirtualBox

VirtualBox 是 Oracle 公司的开源虚拟机软件。VirtualBox号称是最强的免费虚拟机软件,它不仅功能齐全,而且性能也很优异!VirtualBox 支持大部分流行的系统,如:Mac, Windows, Linux 等。

根据对应系统下载,一步一步默认安装即可。

官网: https://www.virtualbox.org/wiki/Downloads

vagrant

Vagrant 是用来管理虚拟机的工具,支持当前主流的虚拟机系统如 VirtualBox、VMware、AWS 等。Vagrant的主要作用是提供一个可配置、可移植和复用的软件环境。Vagrant 让你通过编写一个 Vagrantfile文件来控制虚拟机的启动、虚拟机网络环境的配置、虚拟机与主机间的文件共享,以及启动后自动执行一些配置脚本,如自动执行一个 Shell Script来安装一些必备的开发工具,如安装配置MySQL、PHP,甚至是自动配置 Nginx 站点。这意味着,在一个多人开发的项目中,你只需要同步 Vagrantfile 文件,就可以保证参与项目的每个人各自的机器上拥有一致的开发环境。

根据对应系统下载,一步一步默认安装即可。

官网:https://www.vagrantup.com/downloads.html

Homestead box

homestead.box 虚拟机盒子是提前打包好的 Vagrant Box 虚拟机盒子,里面预装了 Nginx Web 服务器、PHP 7.0、MySQL、Postgres、Redis、Memcached、Node,以及所有你在使用 Laravel 开发时所需要用到的各种软件。

Box的历史版本:https://app.vagrantup.com/laravel/boxes/homestead

通常有两种安装方式。第一种,使用vagrant命令(先安装好 gitbash工具)。

vagrant box add laravel/homestead 
### 然后,提示选择 虚拟机容器。如果使用的是 VirtualBox 就选择 VirtualBox前边对应的序号,回车。就开始进入安装中了。

由于,文件放在国外,内地访问比较慢,以免中断的情况放生。建议用 迅雷 先将box下载到本地。这个就是第二种方式了。第一种方式中,选择虚拟机容器,回车后,会显示下载的 Homestead box地址,将地址复制出来,用迅雷下载到本地就好了。

这里的地址是: https://vagrantcloud.com/laravel/boxes/homestead/versions/6.1.0/providers/virtualbox.box

下载好 box后,放在系统的磁盘下,待用。比如放在 D:\WebServer\homesteadbox\

Homestead

Homestead 利用 Vagrantfile 提供的便利,定制了一整套的可配置、可移植和复用的 Laravel 开发环境。Homestead 虚拟机里面包含了 Nginx Web 服务器、PHP、MySQL、Postgres、Redis、Memcached、Node,以及所有你在使用 Laravel 开发时需要用到的各种软件。

Homestead 包含了两个东西:Homestead 管理脚本、Homestead Box 虚拟机盒子。
虚拟机盒子上一步骤已经下载好了。这里下载管理脚本。

git clone https://github.com/laravel/homestead.git ~/Homestead 

运行 init.bat ,生成 Homestead.yaml 配置文件。

安装盒子

在 Homestead 目录下,创建 metadata.json 文件。内容如下:

{
    "name": "laravel/homestead",
    "versions": 
    [
        {
            "version": "6.1.0",
            "providers": [
                {
                  "name": "virtualbox",
                  "url": "D:/WebServer/homesteadbox/virtualbox.box"
                }
            ]
        }
    ]
}

开始安装:

vagrant box add metadata.json

等待安装完成。安装完成,会有 success 提示的。

编辑 Homestead.yaml

  1. 下载 Homestead 配置。
git clone https://github.com/laravel/homestead.git ~/Homestead 

cd ~/Homestead

# 初始化
bash init.sh

# ssh 秘钥
# 先看看有木有
ls -al ~/.ssh

# 木有就创建,一直回车就可以
ssh-keygen -t rsa -C "your_email@example.com"

# 然后配置 Homestead.yaml 

参考:
https://learnku.com/docs/laravel-development-environment/5.8/development-environment-windows/4373

Homestead.yaml 文件,是配置虚拟机的相关映射设置,以及和本地电脑系统的映射。默认,就有该文件,稍微修改成自己所需的就可以了。如下:

---
ip: "192.168.10.10"
memory: 2048
cpus: 1
provider: virtualbox

authorize: ~/.ssh/id_rsa.pub

keys:
    - ~/.ssh/id_rsa

folders:
    - map: ~/Code
      to: /home/vagrant/Code
    - map: ~/Study
      to: /home/vagrant/Study

sites:
    - map: weapp.com
      to: /home/vagrant/Code/weapp/public
    - map: wechat.com
      to: /home/vagrant/Study/wechat/public
databases:
    - wechat
    - weapp

variables:
    - key: APP_ENV
      value: local

# blackfire:
#     - id: foo
#       token: bar
#       client-id: foo
#       client-token: bar

# ports:
#     - send: 50000
#       to: 5000
#     - send: 7777
#       to: 777
#       protocol: udp

至于,改配置的详解,可以百度。

启动

cd ~/Homestead
vagrant up
vagrant provision
vagrant reload
vagrant ssh

如果有以下错误,可以先升级 powershell

The version of powershell currently installed on this host is less than
the required minimum version. Please upgrade the installed version of
powershell to the minimum required version and run the command again.

Installed version: 2

Minimum required version: 3

补救

看到提示 homestead-7: Box 'laravel/homestead' could not be found. Attempting to find and install 了吗。 烦啊,版本不匹配,配置没写对,总之,就是不让你好。

box 名字不对,可以修改 metadata.json 中的 name。 用 vagrant box remove xxx 移除之前的,再 vagrant box add 一次 box。最后, vagrant up再启动看看。 这一切启动,都在从 https://github.com/laravel/homestead 这里 clone 下的目录中进行。目录位置最好存在 ~/Homestead 。如果还有错误,卸载了看流程重装吧。累。

下载参考:

windows7 执行vagrant up 提示powershell版本过低的解决方法


https://www.jb51.net/softs/580141.html

就算之前没有安装 Homestead box,执行 vagrant up的时候,也会去安装的。

参考

https://laravel.com/docs/5.6/homestead

https://laravel-china.org/docs/laravel-development-environment/5.5/development-environment-windows/938

阅读全文 >>

7月 06

现象

使用 vagrant 启动 VirtualBox 失败,提示:

Bringing machine 'homestead-7' up with 'virtualbox' provider...
There was an error while executing `VBoxManage`, a CLI used by Vagrant
for controlling VirtualBox. The command and stderr is shown below.

Command: ["list", "hostonlyifs"]

Stderr: VBoxManage.exe: error: Failed to create the VirtualBox object!
VBoxManage.exe: error: Failed to instantiate CLSID_VirtualBox w/ IVirtualBox, CLSID_VirtualBox w/ IUnknown works.
VBoxManage.exe: error: PSDispatch looks broken by some installer featuring the broken oleaut32.msm module as a component.

VBoxManage.exe: error: See also https://support.microsoft.com/en-us/kb/316911
VBoxManage.exe: error: Details: code E_NOINTERFACE (0x80004002), component VirtualBoxClientWrap, interface IVirtualBoxClient

或手动启动 VirtualBox 提示:

引起的原因

使用 vagrant 启动 VirtualBox,没有使用 vagrant halt 关闭服务时,可能会引起上述的错误。

解决方法

修改注册表法:

  1. win + r 打开运行输入界面。输入 regedit 回车,弹出注册表面板。

  2. 找到下图这里,并进行修改。再启动就会好了。

修改注册表的如下两项:
HKEY_CLASSES_ROOT\CLSID{00020420-0000-0000-C000-000000000046}\InprocServer32
HKEY_CLASSES_ROOT\CLSID{00020424-0000-0000-C000-000000000046}\InprocServer32

将它们的默认值都改成:
C:\Windows\system32\oleaut32.dll

阅读全文 >>

5月 24

仅仅看表象,以为是 js 实现的效果,却是 css 实现的。这里有一个例子,利用 radio 的单选特性,实现单选效果。

步骤

  1. 创建 input标签,邻居创建 span标签。
  2. 父容器相对定位,input绝对定位,left,top为0,opacity为0。看不见看不见。
  3. 利用 + ,~ 处理邻居 div。
  4. 利用 checked 实现变化。

让 input 透明掉,其实就是让你去美化 span,不再需要 radio 那难看的容颜。是不是有点不道德啊。

请看 code:

<div class="box">

  <div class="tags-select">
    <label class="tag-select">
        <input type="radio" name="bye-type" value="1" checked>
        <span class="name">官方标配</span>
    </label>

    <label class="tag-select">
        <input type="radio" name="bye-type" value="2">
        <span class="name">官方标配 + 蓝牙耳机</span>
    </label>

    <label class="tag-select">
        <input type="radio" name="bye-type" value="3" disabled>
        <span class="name">官方标配 + 充电宝</span>
    </label>
  </div>

</div>

<!-- 利用radio唯一性,实现了不用js也能实现的效果。右边是 scss -->

.tags-select{
  font-size: 0;

  > .tag-select{
      position:relative;
      display:inline-block;
      font-size: 14px;
      margin: 5px;
      color: #fff;


     .name{
         display: block;
         line-height: 20px;
         padding: 8px 10px;
         border-radius: 5px;
         background-color: #FE7D91;
         cursor:pointer;
     }

     .name:hover{
         background-color: #FE3591;
     }

     input[type="radio"]{
         position:absolute;
         z-index: -1;
         opacity: 0;

         //选中
         &:checked +.name{
             background-color: #FE3591;
         }

         //禁用
         &:disabled +.name{
           background: #eee;
           color: #999;
           cursor: not-allowed;
         }
     }
  }
}

.box{
    display:flex;
    width:100%;
    height:100px;
    justify-content:center;
    align-items:center;
}

记得,上边使用了 scss。

效果

https://jsfiddle.net/vini123/ad30qpyb/

阅读全文 >>

5月 24

在传统 div 排版中。padding竟会占用父容器的宽高,这个很影响心情和需要。

比如下边这个布局:

.group{
   margin:20px;
}

.item{
    display:inline-block;
    width:250px;
    height:40px;
    line-height:40px;
    background-color:#FE7D91;
    color:#fff;
    border-radius:3px;
 }

.item label{
    float:left;
    width:35%;
    text-align:right;
    font-size:16px;
  }

.item label ~div{
    float:left;
    width:65%;
    font-size: 14px;
  }

<div class="group">
  <div class="item"> 
    <label>神奇</label>
    <div>动物在哪里</div>
  </div>
</div>

使用 box-sizing,容器宽度都不会被撑开。

还有一种方法,就是使用 flex 布局。

完整的demo:https://jsfiddle.net/vini123/kbecxju7/1/

参考

http://www.w3cplus.com/content/css3-box-sizing

阅读全文 >>

5月 17

随着互联网的普及,人们的上网行为每天都产生着海量的数据,这些数据蕴含着巨大的价值,清楚的刻画着社会的方方面面,现如今,数据已经成为一种商业资本,一项经济投入,政府和企业都在研究如何从海量数据中获得新的认知、新的方法和创造新的价值,这就促进了大数据的发展,企业用大数据技术往往运行在Linux环境下,大数据工程师需要掌握一定的Linux技术,以下是老男孩教育归纳的大数据工程师需要掌握的Linux技术

一、VMware Workstation

  1. VMware软件安装与配置,网络连接模式,NAT、桥接、OnlyHost
  2. 宿主机、虚拟机、客户机异同,虚拟机完全克隆、虚拟机链接克隆

  3. mac地址修改,虚拟网卡设置,虚拟网络编辑器,虚拟机移除

二、CentOS

  1. Linux系统简介,CentOS,Ubuntu,Windows

  2. CentOS下载、安装与配置

阅读全文 >>