30 秒?!Chrome 插件带你速成编程学习 | 程序员硬核评测

640?wx_fmt=gif

640?wx_fmt=jpeg

去年,GitHub 上火了一个叫作 30 Seconds of Code (30 秒学会编程)的项目,精选了 JavaScript 代码段集合,这些代码段都是开发者能够在 30 秒乃至更短期内理解的。根据 GitHub 此前发布的《Octoverse 观察报告》显示,该项目更是入选 2018 年度十大开源项目。php

GitHub 上相似的 30 秒系列仓库还包括 30 Seconds of CSS(CSS 代码集)、30 Seconds of Interviews(面试问题集锦)、30 Seconds of React(React 代码集) 等。
css

受到 30 秒学编程的灵感启发,从事 Web 开发的 Stefan Petrovic 在这些开源项目的基础上,建立了 30 Seconds of Knowledge——该项目是一个 Google Chrome 扩展程序,可以令开发者在每次打开新标签页时,都得到新的开发人员技能。python


640?wx_fmt=png

是什么?react


640?wx_fmt=jpeg

按照该插件在说明文档中的描述,你能够在扩展选项中选择你想要提高的编程语言,并在每次打开新标签时更加智能。而你只需 30 秒便可阅读和理解其所提供的代码片断来提升本身的知识水平。若是碰巧看到对本身有用的东西,只需将其复制/粘贴到你的代码中就能够了!
git

该插件用 React 构建,其余开源项目则提供了代码段:程序员

  • 30 Seconds of Code:https://github.com/30-seconds/30-seconds-of-codegithub

  • 30 Seconds of CSS:https://github.com/30-seconds/30-seconds-of-cssweb

  • 30 Seconds of Interviews:https://github.com/30-seconds/30-seconds-of-interviews面试

  • 30 Seconds of React:https://github.com/30-seconds/30-seconds-of-reactchrome

  • 30 Seconds of PHP:https://github.com/appzcoder/30-seconds-of-php-code

  • 30 Seconds of Python:https://github.com/kriadmin/30-seconds-of-python-code

栈(Stack)

  • React

  • Google Chrome Extension API

可用的代码段库:

  • JavaScript

  • CSS

  • 面试问题

  • React

  • PHP

  • Python


目前,六种类别选择共包含超 500 个代码段,后续还将继续添加。

当前该扩展程序主要支持:

  • MVP 模式(仅限 Chrome)

  • Landing Page

  • 已发布至 Product Hunt

  • 黑色/亮色主题

  • 新增“捐助打赏”选项

  • 新增保存/收藏特性

  • 发布 v1.0.0 版本

将来还将添加 Firefox 及 Safari 端口。


640?wx_fmt=png

怎么用教程详解


安装

640?wx_fmt=png

目前,该插件的版本为 1.0.0,能够直接在 Chrome 网上应用店官方网站进行下载安装及删除,已积累用户 10129 位。

640?wx_fmt=png

设置

在 Chrome 中启用该插件,点击左上 640?wx_fmt=png 按钮进入设置界面:

640?wx_fmt=png

在这里能够勾选你须要学习或提高的内容(已精通或不感兴趣的内容便可取消勾选状态),同时还能够选择黑色/亮色主题,选择完毕后点击【Save】保存,便可开启你的 30 秒打卡速学之旅。

代码学习

每一次刷新/打开新标签,都会为你显示新的内容,这些代码段都方便你在短期内进行理解和学习。

640?wx_fmt=png

640?wx_fmt=png

复制及保存

对于想要“留为己用”的代码段,能够经过点击代码右下角的 640?wx_fmt=png 按钮进行代码复制,并粘贴到本身的代码库中,即取即用。如果 CSS 代码段,你还能够在 CodePen 上实时预览。

640?wx_fmt=png

或是直接点击【Save】保存代码,也便于二次学习/稍后再看。

640?wx_fmt=png

同时,你也能够经过点击页面左下角的 640?wx_fmt=png 按钮,跳转内容管理界面,管理你此前保存过的代码段(删除操做)。

640?wx_fmt=png

“Chrome 因插件而美丽,这款开发者工具可否知足你的需求呢?

插件源码:

https://github.com/petrovicstefanrs/30_seconds_of_knowledge

下载安装:

https://chrome.google.com/webstore/detail/30-seconds-of-knowledge/mmgplondnjekobonklacmemikcnhklla

硬核评测专栏回顾:

【完】


640?wx_fmt=jpeg

 热 文 推 荐 

 郑州没有互联网 | 畅言 

☞ 他用代码终结“撒贝宁”,21123 个岗位急招 AI 程序员!

☞ 朋友圈新增访客记录?大众点评辟谣”被放弃”;百度 7 款 APP 进入 App Store 前十 | 极客头条

☞ 那些简历造假拿 Offer 的程序员,后来都怎么样了?

☞ K8S安全军规101:对CNCF最佳实践的扩充

☞ 为何说稳定币才是诺奖得主哈耶克想要的非国家货币?

☞ 月入5万,程序员夫人们过上"贵妇"生活了吗?

“扔瓶子”有套路?日本高中生开发机器人,手残党们有救了

 
 

print_r('点个好看吧!');
var_dump('点个好看吧!');
NSLog(@"点个好看吧!");
System.out.println("点个好看吧!");
console.log("点个好看吧!");
print("点个好看吧!");
printf("点个好看吧!\n");
cout << "点个好看吧!" << endl;
Console.WriteLine("点个好看吧!");
fmt.Println("点个好看吧!");
Response.Write("点个好看吧!");
alert("点个好看吧!")
echo "点个好看吧!"

640?wx_fmt=gif点击“阅读原文”,打开 CSDN App 阅读更贴心!

640?wx_fmt=png 喜欢就点击“好看”吧!