掌握 reveal.js

¥Mastering reveal.js

本视频课程将教你如何使用 reveal.js 创建精美的演示文稿所需的一切知识。

¥This video course that will teach you how to everything you need to know to create great looking presentations with reveal.js.

我们将从安装 reveal.js、创建幻灯片和配置演示文稿的基础知识开始。然后,我们将逐步讨论更有趣的主题,例如呈现语法高亮的代码、使用自动动画功能为幻灯片内容制作动画以及使用演讲者视图。在高级视频中,我们将探讨 reveal.js JavaScript API、插件创建以及如何自定义键盘绑定。(参见 完整视频列表。)

¥We'll start from the basics of installing reveal.js, creating slides and configuring your presentation. Then we'll work our way up to more interesting topics like presenting syntax highlighted code, animating slide content with Auto-Animate and using the speaker view. In the advanced videos we'll explore the reveal.js JavaScript API, plugin creation and how to customize keyboard bindings. (See full list of videos.)

这是给谁用的?

¥Who is this for?

本课程面向 reveal.js 的新手,以及已经了解基础知识但准备探索完整功能集的学员。

¥The course is aimed at people who are new to reveal.js as well as those of you who already understand the fundamentals but are ready to explore the full feature set.

你需要对 HTML、CSS 和 JavaScript 有基本的了解。HTML 是 reveal.js 的核心,并在整个课程中被广泛使用。CSS 和 JavaScript 主要用于高级视频,主题包括创建自定义主题、使用 reveal.js API 以及编辑源代码。

¥You'll need to have a basic understanding of HTML, CSS and JavaScript. HTML is the backbone of reveal.js and used extensively throughout the course. CSS and JavaScript are mostly used for advanced videos on topics such as creating custom themes, working with the reveal.js API and editing the source code.

谁在演示?

¥Who is presenting?

👋 我是 Hakim - 一位瑞典前端开发者,也是 reveal.js 的创始人。我与他人共同创立了 Slides.com,目前正在开发它 - 一个基于 reveal.js 构建的演示平台和图形编辑器。除此之外,我还喜欢在 hakim.se 上进行可视化演示和实验。

¥👋 I'm Hakim—a Swedish front-end developer and the creator of reveal.js. I co-founded and am currently working on Slides.com—a presentation platform and graphical editor built on top of reveal.js. Beyond that I love to work on visual demos and experiments at hakim.se.

我 10 年前发布了 reveal.js 的第一个版本(!),当时我从未想过它最终会发展壮大,拥有数十万人的使用。我希望你能加入我们,亲主体验为什么这么多人选择使用 reveal.js 创建演示文稿!

¥I released the first version of reveal.js 10 years ago (!) and couldn't have imagined that it would eventually grow to be used by hundreds of thousands of people. I hope you'll join in and experience first hand why so many choose to create their presentations with reveal.js!

$99 $79

Buy course
  • 22 videos
  • 5h 39m total runtime
  • Stream in HD
  • Download in 4K
  • Free updates

本课程通过 Gumroad 销售。增值税将在购买时添加(如适用)。如果课程不适合你,可获得 100% 退款,无需任何理由。

¥The course is sold via Gumroad. VAT is added at the time of purchase, if applicable. 100% money back if the course isn't a good fit for you—no questions asked.

目录

¥Table of Contents

课程分为相对较短的视频,以便你轻松跳过与你不相关或你已经熟悉的主题。总运行时间为 5.5 小时。

¥The course is divided into relatively short videos so that you can easily skip topics that aren't relevant to you or that you are already familiar with. The total runtime is 5.5 hours.

入门指南
入门指南持续时间
安装 reveal.js 并设置开发服务器。5:40
创建幻灯片、在幻灯片之间建立链接并保存草稿。10:04
配置你的演示文稿。8:23
使用垂直幻灯片。9:05
使用 Markdown 创建幻灯片。16:34
内容创建
在幻灯片中添加文本、图片、视频和 iframe。10:47
使用堆叠和自动调整大小的文本布局幻灯片内容。13:58
全屏背景图片、视频、颜色和 iframe。16:26
显示语法高亮的代码。21:51
使用 Fragments 分步构建幻灯片。13:14
使用自动动画功能为幻灯片内容添加动画效果。17:01
配置和功能
显示大小和比例。14:34
幻灯片切换效果。12:36
为你的内容设置主题并创建你自己的主题。16:12
演讲者备注和使用演讲者视图。11:27
幻灯片编号和 URL。19:55
将你的演示文稿转换为 PDF。10:23
高级 (JS)
初始化并运行多个演示文稿。19:06
插件;在哪里可以找到它们以及如何创建它们。14:52
使用 reveal.js API 控制你的演示。40:32
自定义键盘快捷键。15:04
使用源代码。21:09