Skip to content

Latest commit

 

History

History
261 lines (180 loc) · 6.18 KB

panli.md

File metadata and controls

261 lines (180 loc) · 6.18 KB
Raw

title: 2015年述职报告 speaker: zan url: https://github.com/ipanli/panliPPT.git transition: move files: /js/demo.js,/css/demo.css,/js/zoom.js theme: dark usemathjax: yes

[slide style="background-image:url('/ppts/images/ppt-start.png')"]

[slide]

你喜欢什么颜色的背景

深蓝-亮蓝-黑色-绿色-白色

[slide]

我是谁?

我来这里做什么

演讲者：周赞生 (Julian)

[slide]

你是干嘛的 {:&.flexbox.vleft}

前端工程师 (欠锻攻城狮) -- 优雅的90后,每天写点有意思的代码,然后分享给朋友看,Hi,xxx,这是刚出炉的，酷不酷( 裤呆了 )！

[slide]

理想的工作环境

  • 极客代码疯狂群体 {:&.rollIn}
  • 新技术发烧友
  • 全栈工程师
  • 开源爱好者
  • 为自己的理想方案而争吵
  • 专业填坑100年

[slide]

目前的开发环境

目前的开发环境

[slide]

跨终端同步响应

目前的开发环境

[slide]

我们做了些什么

$$ x = {-b \pm \sqrt{b^2-4ac} \over 2a}. s = ut + \frac{1}{2}at^2 $$ 矩阵：\( x = {\begin{bmatrix} 1 & 2 & 3 \\ 4 & 5 & 6 \end{bmatrix}} \)

[slide]

Panli 前端组件库

<iframe data-src="http://panli.mu.gg/book-pc/" src="about:blank;"></iframe>

[slide]

日常工作

panli 主站的 活动页 和 专题页的开发

[slide]

[subslide]

通过日常工作学到了

  • 同事间的同力协作
    • 明确工作流程 {:&.moveIn}
    • 遇到问题立马解决
    • 职责所在寻求帮助
    • 文字泪奔~~o(>_<)o ~~ ============

前端已经不在是一个手工的年代

  1. 快速敏捷开发？ {:&.rollIn}
  2. 前端工程化 -- 思想很重要
  3. 前端自动化 -- 开发环境自动化工具
  4. 前端组件化 -- 可复用,可复制。
  5. 界面设计语言 -- 风格统一，认识度高。 [/subslide]

[slide]

如何有效传播新 (New) 技能 （get）

  • 技能知识文档的建立 {:&.bounceIn}
  • 每日 (get) 新技能 的心得记录
    • 好记性不如烂笔头
    • 友好的文字阅读体验
    • 记录可以传播的更广
    • 暂时就这些吧...

[slide]

技术栈

涉猎的语言

| 语言名称 | 认知度 | 认知度 | |:-------|:------:|: ------:| |js/nodejs | 熟悉 {:.highlight} | 喜欢 | | less | 熟悉 | 可以 | | sass | 熟悉 | 常用 | | php | 熟悉 | 起家 | | ruby | 玩过 | 喜欢 | | python | 玩过 | 喜欢 | | java | 玩过 | 无爱 | | ... | ... | ... |

[slide]

未来能做什么

每日码农,终有一日顶苍天！

码农

[slide]

码农的乐趣之一

<iframe data-src="http://kushagragour.in/code-blast-codemirror/demo/" src="about:blank;"></iframe>

[slide]

界面语言设计库

我是按钮 .btn.btn-lg.btn-primary .btn.btn-waring .btn.btn-success .btn.btn-danger

.btn.btn-lg.btn-default .btn.btn-xs.btn-success .btn.btn-sm.btn-primary .btn.btn-rounded.btn-waring disabled.btn.btn-danger

[slide]

icons: Font Awesome

字体君

[slide]

代码格式化

使用 highlightjs 进行语法高亮

(function(window, document){
    var a = 1;
    var test = function(){
        var b = 1;
        alert(b);
    };
    //泛数组转换为数组
    function toArray(arrayLike) {
        return [].slice.call(arrayLike);
    }
}(window, document));
    
(function(window, document){
    var a = 1;
    var test = function(){
        var b = 1;
        alert(b);
    };
    //泛数组转换为数组
    function toArray(arrayLike) {
        return [].slice.call(arrayLike);
    }
}(window, document));

[slide] [note]

如何做好笔记

使用 markdown 做笔记

flintjs 将颠覆前端 UI 开发？

我说它是个颠覆，并不是说这东西一出来就能在实际生产中取代 React Angular 之类的东西， 而是因为它代表了一种更先进的开发模式，而且可以预见将来不仅仅是前端开发， 而是所有的 UI 开发都会向这个模式发展。 [/note]

按下键盘【N】键预览笔记，

[slide data-transition="kontext"]

使用画笔

使用画笔做标记哦~你也可以随便作画啊！

按下键盘【P】键：按下鼠标左键，在此处乱花下看看效果。

按下键盘【B/Y/R/G/M】：更换颜色，按下【1~4】：更换粗细

按下键盘【C】键：清空画板

[slide]

20种转场动画随心换