介绍我们将在接下来的几章中构建的应用程序
配置我们的CSS样式表，使其看起来更像一个本机应用程序
回顾在Electron中主进程和渲染器进程之间的关系
为我们的主进程和渲染器进程实现基本功能
在Electron渲染进程中访问Chrome开发者工具
我们的书签管理器是一个很好的开始，但它只触及了我们可以用Electron做什么。
在本章中，我们将更深入地探讨，并为与用户操作系统建立更紧密联系的应用程序打下基础。在接下来的几章中，我们将实现触发操作系统用户界面,对文件系统进行读写和访问剪贴板的功能。
我们正在构建一个简单的Markdown编辑器，它允许我们创建新的或打开现有的Markdown文件，将它们转换为HTML，并将HTML保存到文件系统和剪贴板中。让我们把这个应用程序称为Fire Sale，因为它毕竟是一个廉价编辑器，只是稍微聪明一点而已。
在本章的最后，我们将讨论在出现问题时调试Electron应用程序的技术和工具。
定义我们的应用
让我们从为我们不起眼的小应用程序设置目标开始。
对于桌面应用程序，我们的许多特性可能看起来有些平庸，这就是重点。它们是桌面应用程序的标准配置，但完全超出了传统web应用程序的能力范围，传统web应用程序无法访问独立浏览器选项卡之外的任何内容。
我们的应用程序将由两个窗格组成，用户可以编写或编辑Markdown和一个右窗格，该窗格以HTML形式呈现用户的Markdown。在顶部有一系列按钮，允许用户从文件系统加载文本文件，并将结果写入剪贴板或文件系统。
在应用程序的第一阶段，我们构建了以下的界面。在图3.1。我们还可以向效果图(以及随后的应用程序)添加额外的用户界面元素，但这是一个很好的开始。
图3.1 我们的应用程序的线框显示，用户可以在左侧窗格中输入文本，或者从用户的文件系统的文件中加载文本。
在这一章中，我们为我们的应用奠定了基础。我们创建项目的结构，安装依赖项，设置主进程和呈现器进程，构建用户界面，并在用户向左侧窗格输入文本时实现markdown到HTML的转换。
我们将在接下来的几章中分阶段构建应用程序的其余部分。在每一章中，您将下载我们应用程序的当预期目标代码。通过这种方式，您可以切换到一个章节，其中包含您感兴趣的功能，而不必从头构建整个应用程序。
在第一阶段，我们的应用程序将能够
打开并保存文件到文件系统
从这些文件获取Markdown内容
将Markdown内容呈现为HTML
将生成的HTML保存到文件系统中
将生成的HTML写入剪贴板
在后面的章节中，我们的应用程序使用本地操作系统接口跟踪最近打开的文档。我们可以将Markdown文件从Finder或Windows资源管理器拖放到应用程序上，并让应用程序立即打开该Markdown文件。当我们右键单击应用程序的不同区域时，应用程序将有自己的自定义应用程序菜单和自定义上下文菜单。
我们还利用了操作系统特有的特性，比如更新应用程序的标题栏，以显示当前打开的文件，以及自上次保存以来是否已经更改。如果计算机上的其他应用程序在打开文件时更改了文件，我们还实现了其他功能，比如更新应用程序中的内容。
奠定基础如图3.2所示的文件结构与我们在前一章中商定并用于书签管理器的结构非常相似。
为了简化和清晰，在我们继续熟悉Electron时，我们在app/main.js中保存了主进程的所有代码，在app/renderer.js中保存了单渲染器进程的所有代码。我们将app文件夹存储在基于unix的操作系统上，以便能够快速生成它，如下面的清单所示。或者，您可以在GitHub上查看这个项目的主分支，网址是https://github.com/electron-in-action/firesale。
图3.2 我们工程结构