《HelloWorld公开课》自开播以来，为广大的学员普及了一系列的技术干货内容，受到了许多学员的喜爱。但我们也深知，系统的技术知识仅仅是一方面。在日常的开发中，如果你掌握了巧妙的开发技巧，是可以指数级提升你的开发效率的。

这不，5月8号的公开课，前端老司机川哥为我们奉献了他多年编码所积攒下来的所有开发技巧，如果你是一名前端开发人员，这节公开课你必不可错过。

代码开发技巧

说起代码开发技巧和规范，最让人头疼的莫过于命名，特别是新手而言，用拼音来给字段命名那是常用的事情。所以我们先来看下，在前端日常开发中，有哪些字段是需要注意的

前端开发常用命名

头

header

搜索

search

子导航

subnav

菜单

menu

当前的

current

内容

content

标志

logo

登录条

loginbar

版权

copyright

容器

container

广告

banner

子菜单

submenu

指南

guide

尾

footer

主体

main

小技巧

tip

服务

service

导航

nav

热点

hot

合作伙伴

partner

注册

register

侧栏

sidebar

新闻

news

栏目标题

title

状态

status

栏目

column

下载

download

提示信息

msg

投票

vote

CSS文件常用命名

用途

文件名称

主要的

master.css

表单

form.css

模块

module.css

补丁

mend.css

基本共用

base.css

字体样式

font.css

布局，版面

layout.css

全局样式

global.css

主题

theme.css

打印样式

print.css

专栏

columns.css

文字

font.css

除了命名规范，下划线的使用也要注意，- 中划线，仅作为连字符使用，表示某个块或者某个子元素的多单词之间的连接记号。__ 双下划线用来连接块和块的子元素，_ 单下划线用来描述一个块或者块的子元素的一种状态，同时修饰符值与修复符名称之间也用单个下划线。

工具使用技巧

良好的工具可以帮助我们高效的开发项目。前端er在日常开发中接触最多的想必是HTML、CSS、JS、调试这几方面的内容。针对这几个模块，川哥也给我们准备了相对于的开发利器。巧用下面的开发工具，相信你的代码开发速率会有质的飞跃。

CSS代码分析统计工具：检查网站样式字体，字体大小等

语法参考：查看css语法规则

CSS工具：css转换预编译，css各属性可视化效果

Flex-box 帮助：flex-box可视化查看，帮助学习

色系选择：选择合适的色系，对没有审美底子的友好

图文 CSS 语法效果：左侧代码右侧效果

Grid Garden：闯关游戏的方式学习grid

bearcss：基于HTML结构生成CSS样式结构

bootcss可视化布局：拖拽的方式构建HTML结构，可导出代码

jsconsole：web版console

工具函数大全 2：常用工具方法汇总

设计模式大全：很全的设计模式介绍

如何提升自身能力

能力的提升可以分为信息检索、知识获取、总结归纳三个部分，最后的总结归纳部分没有捷径可走，需要你经常使用思维导图进行自身知识体系的总结，建立自己的技能树。下面来看看，有哪些方法可以提高我们的信息检索和知识获取的能力

信息检索

操作|平台

google

baidu

github

搜索某种类型的文件

前端 filetype:pdf

前端 filetype:pdf

逻辑与

农夫 蛇

农夫 蛇

-不含特定查询词

前端 -切图仔

前端 -切图仔

双引号 查询词不能被拆分

“前端技巧”

“前端技巧”

site

全栈 site:segmentfault.com

intitle

intitle:前端开发

intitle:前端开发

language:

language:javascript

location:

location:china

stars:

stars:>=500

Awesome + 关键字

Awesome Vue

Github搜索技巧

知识的获取强烈依赖渠道和信息差，针对前端开发者，川哥列举了如下的实用网站，灵活运用这些资源，相信在信息获取方面，你会快人一步。

描述

地址

前端前沿

前端前沿信息获取

设计导航

可以获取前端样式设计的资源

阿猫阿狗导航

产品用，前端可以开拓视野

前端开发博客

强烈推荐，内容很全

Githuber

github作者排行

前端导航网

这是一个很酷炫的前端网站搜集器

讲师介绍

川哥，FCC武汉社区组织者，360前端Leader

《Hello,World公开课》是由开课吧推出的面向广大开发工程师的免费加餐课，集结业内名师大咖，聚焦热门技术和实战解决方案，以专业知识分享交流为桥梁，链接正在创造世界的一群科技主力们，向初心致敬，为技术发烧。无论你是初入职场的应届生，还是准备升职加薪的职场精英，相信这里都有你需要的养料。