前言:
今天姐妹们对“bearcss”都比较着重,姐妹们都需要了解一些“bearcss”的相关知识。那么小编在网上搜集了一些对于“bearcss””的相关资讯,希望朋友们能喜欢,看官们一起来了解一下吧!《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:常用工具方法汇总
设计模式大全:很全的设计模式介绍
如何提升自身能力
能力的提升可以分为信息检索、知识获取、总结归纳三个部分,最后的总结归纳部分没有捷径可走,需要你经常使用思维导图进行自身知识体系的总结,建立自己的技能树。下面来看看,有哪些方法可以提高我们的信息检索和知识获取的能力
信息检索
操作|平台
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公开课》是由开课吧推出的面向广大开发工程师的免费加餐课,集结业内名师大咖,聚焦热门技术和实战解决方案,以专业知识分享交流为桥梁,链接正在创造世界的一群科技主力们,向初心致敬,为技术发烧。无论你是初入职场的应届生,还是准备升职加薪的职场精英,相信这里都有你需要的养料。
标签: #bearcss