add edit urls for overview docs

This commit is contained in:
dillon 2015-10-03 13:11:25 -07:00
parent d4adc65a2a
commit f293af4efc
10 changed files with 10 additions and 10 deletions

View file

@ -1,6 +1,7 @@
---
layout: docs
title: Application Architecture
edit_url: "https://github.com/nylas/N1/blob/a2c697754ad692e6a54629ffd93883dda79b0d78/docs/Architecture.md"
---
<p>N1 uses <a href="https://github.com/spoike/refluxjs">Reflux</a>, a slim implementation of Facebook&#39;s <a href="https://facebook.github.io/flux/">Flux Application Architecture</a> to coordinate the movement of data through the application. Flux is extremely well suited for applications that support third-party extension because it emphasizes loose coupling and well defined interfaces between components. It enforces:</p>
<ul>
@ -26,4 +27,3 @@ title: Application Architecture
<p>In Flux applications, views fire <a href='actions.html'>Actions</a>, which anyone in the application can subscribe to. Typically, <code>Stores</code> listen to actions to perform business logic and trigger updates to their corresponding views. For example, when you click &quot;Compose&quot; in the top left corner of N1, the React component for the button fires <a href='Actions.html#composeNewBlankDraft'>Actions::composeNewBlankDraft</a>. The <a href='draftstore.html'>DraftStore</a> listens to this action and opens a new composer window.</p>
<p>This approach means that your packages can fire existing <a href='actions.html'>Actions</a>, like <a href='Actions.html#composeNewBlankDraft'>Actions::composeNewBlankDraft</a>, or observe actions to add functionality. (For example, we have an Analytics package that also listens for <a href='Actions.html#composeNewBlankDraft'>Actions::composeNewBlankDraft</a> and counts how many times it&#39;s been fired.) You can also define your own actions for use within your package.</p>
<p>For a complete list of available actions, see <a href='actions.html'>Actions</a>.</p>

View file

@ -1,6 +1,7 @@
---
layout: docs
title: Accessing the Database
edit_url: "https://github.com/nylas/N1/blob/a2c697754ad692e6a54629ffd93883dda79b0d78/docs/Database.md"
---
<p>N1 is built on top of a custom database layer modeled after ActiveRecord. For many parts of the application, the database is the source of truth. Data is retrieved from the API, written to the database, and changes to the database trigger Stores and components to refresh their contents. The illustration below shows this flow of data:</p>
<p><img src="./images/database-flow.png"></p>
@ -112,4 +113,3 @@ DatabaseStore.<span class="hljs-function"><span class="hljs-title">find</span><s
<li><p>All changes to the local database must be observable</p>
</li>
</ul>

View file

@ -1,6 +1,7 @@
---
layout: docs
title: Debugging N1
edit_url: "https://github.com/nylas/N1/blob/a2c697754ad692e6a54629ffd93883dda79b0d78/docs/Debugging.md"
---
<h3 id="chromium-devtools">Chromium DevTools</h3>
<p>N1 is built on top of Electron, which runs the latest version of Chromium (at the time of writing, Chromium 43). You can access the standard <a href="https://developer.chrome.com/devtools">Chrome DevTools</a> using the <code>Command-Option-I</code> (<code>Ctrl-Shift-I</code> on Windows/Linux) keyboard shortcut, including the Debugger, Profiler, and Console. You can find extensive information about the Chromium DevTools on <a href="https://developer.chrome.com/devtools">developer.chrome.com</a>.</p>
@ -39,4 +40,3 @@ title: Debugging N1
</li>
</ul>
<p>In the future, we&#39;ll support much richer hot-reloading of plugin components and code. Stay tuned!</p>

View file

@ -1,6 +1,7 @@
---
layout: docs
title: Extending the Composer
edit_url: "https://github.com/nylas/N1/blob/a2c697754ad692e6a54629ffd93883dda79b0d78/docs/DraftStoreExtensions.md"
---
<p>The composer lies at the heart of N1, and many improvements to the mail experience require deep integration with the composer. To enable these sort of plugins, the <a href='draftstore.html'>DraftStore</a> exposes an extension API.</p>
<p>This API allows your package to:</p>
@ -36,4 +37,3 @@ title: Extending the Composer
or trademarks used in context."</span>
session.changes.add(<span class="hljs-attribute">body</span>: bodyWithWarning)
</code></pre>

View file

@ -1,6 +1,7 @@
---
layout: docs
title: FAQ
edit_url: "https://github.com/nylas/N1/blob/a2c697754ad692e6a54629ffd93883dda79b0d78/docs/FAQ.md"
---
<h3 id="do-i-have-to-use-react-">Do I have to use React?</h3>
<p>The short answer is yes, you need to use React. The <a href='componentregistry.html'>ComponentRegistry</a> expects React components, so you&#39;ll need to create them to extend the N1 interface.</p>
@ -19,4 +20,3 @@ title: FAQ
</li>
</ol>
<p>Note: In the near future, we&#39;ll be formalizing the process of distributing packages, and packages you publish now may need to be resubmitted.</p>

View file

@ -1,6 +1,7 @@
---
layout: docs
title: Interface Concepts
edit_url: "https://github.com/nylas/N1/blob/a2c697754ad692e6a54629ffd93883dda79b0d78/docs/InterfaceConcepts.md"
---
<p>The N1 user interface is conceptually organized into Sheets. Each Sheet represents a window of content. For example, the <code>Threads</code> sheet lies at the heart of the application. When the user chooses the &quot;Files&quot; tab, a separate <code>Files</code> sheet is displayed in place of <code>Threads</code>. When the user clicks a thread in single-pane mode, a <code>Thread</code> sheet is pushed on to the workspace and appears after a brief transition.</p>
<p><img src="./images/sheets.png"></p>
@ -39,4 +40,3 @@ ComponentRegistry<span class="hljs-class">.register</span> NotificationsStickyBa
<p> (Example: Window Controls)</p>
</li>
</ul>

View file

@ -1,6 +1,7 @@
---
layout: docs
title: Overview.md
edit_url: "https://github.com/nylas/N1/blob/a2c697754ad692e6a54629ffd93883dda79b0d78/docs/Overview.md"
---
<p><img src="/static/img/nylas-sdk-cuub@2x.png" class="center-logo"/></p>
<p><h2 style="text-align:center; margin-top:-20px;">Nylas SDK</h2></p>
@ -64,4 +65,3 @@ Need help? Check out the <a href="FAQ.html">FAQ</a> or post a question in the <a
</td></tr>
</table>

View file

@ -1,6 +1,7 @@
---
layout: docs
title: Building a Package
edit_url: "https://github.com/nylas/N1/blob/a2c697754ad692e6a54629ffd93883dda79b0d78/docs/PackageOverview.md"
---
<p>Packages lie at the heart of N1. Each part of the core experience is a separate package that uses the Nylas Package API to add functionality to the client. Want to make a read-only mail client? Remove the core <code>Composer</code> package and you&#39;ll see reply buttons and composer functionality disappear.</p>
<p>Let&#39;s explore the files in a simple package that adds a Translate option to the Composer. When you tap the Translate button, we&#39;ll display a popup menu with a list of languages. When you pick a language, we&#39;ll make a web request and convert your reply into the desired language.</p>
@ -75,4 +76,3 @@ title: Building a Package
</code></pre><h3 id="installing-a-package">Installing a Package</h3>
<p>N1 ships with many packages already bundled with the application. When the application launches, it looks for additional packages in <code>~/.nylas/dev/packages</code>. Each package you create belongs in its own directory inside this folder.</p>
<p>In the future, it will be possible to install packages directly from within the client.</p>

View file

@ -1,6 +1,7 @@
---
layout: docs
title: Interface Components
edit_url: "https://github.com/nylas/N1/blob/a2c697754ad692e6a54629ffd93883dda79b0d78/docs/React.md"
---
<p>N1 uses <a href="https://facebook.github.io/react/">React</a> to create a fast, responsive UI. Packages that want to extend the N1 interface should use React. Using React&#39;s <a href="https://facebook.github.io/react/jsx-in-depth.html">JSX</a> syntax is optional, but both <a href="https://facebook.github.io/react/jsx-in-depth.html">JSX</a> and <a href="https://github.com/jsdf/coffee-react">CJSX</a> (CoffeeScript) are available.</p>
<p>For a quick introduction to React, take a look at Facebook&#39;s <a href="https://facebook.github.io/react/getting-started.html">Getting Started with React</a>.</p>
@ -86,4 +87,3 @@ title: Interface Components
<p>N1 considers all injected components &quot;unsafe&quot;. When you render them using <a href='injectedcomponent.html'>InjectedComponent</a> or <a href='injectedcomponentset.html'>InjectedComponentSet</a>, they will be wrapped in a component that prevents exceptions in their React render and lifecycle methods from impacting your component. Instead of your component triggering a React Invariant exception in the application, an exception notice will be rendered in place of the unsafe component.</p>
<p><img src="./images/unsafe-component-exception.png"></p>
<p>In the future, N1 may automatically disable packages when their React components throw exceptions.</p>

View file

@ -1,6 +1,7 @@
---
layout: docs
title: Writing Specs
edit_url: "https://github.com/nylas/N1/blob/a2c697754ad692e6a54629ffd93883dda79b0d78/docs/WritingSpecs.md"
---
<p>Nylas uses <a href="http://jasmine.github.io/1.3/introduction.html">Jasmine</a> as its spec framework. As a package developer, you can write specs using Jasmine 1.3 and get some quick wins. Jasmine specs can be run in N1 directly from the Developer menu, and the test environment provides you with helpful stubs. You can also require your own test framework, or use Jasmine for integration tests and your own framework for your existing business logic.</p>
<p>This documentation describes using <a href="http://jasmine.github.io/1.3/introduction.html">Jasmine 1.3</a> to write specs for a Nylas package.</p>
@ -86,4 +87,3 @@ describe <span class="hljs-string">"Editor::moveUp"</span>,<span class="hljs-fun
<span class="hljs-function"><span class="hljs-title">expect</span><span class="hljs-params">(<span class="hljs-string">"apples"</span>)</span></span>.<span class="hljs-function"><span class="hljs-title">toEqual</span><span class="hljs-params">(<span class="hljs-string">"apples"</span>)</span></span>
<span class="hljs-function"><span class="hljs-title">expect</span><span class="hljs-params">(<span class="hljs-string">"oranges"</span>)</span></span><span class="hljs-class">.not</span><span class="hljs-class">.toEqual</span>(<span class="hljs-string">"apples"</span>)
</code></pre>