Changes

Jump to: navigation, search

Webmaker/Code

3,152 bytes added, 17:59, 11 October 2013
3. Understand Webmaker Code
# allowing users to create a Webmaker (and by extension, Persona) account.
Beginning with account creation, webmaker.org (and other tools via the common navigation header) connects to the Login server (i.e., login.webmaker.org). Webmaker uses [http://www.mozilla.org/en-US/persona/ Mozilla Persona] for user authentication and sign-in. Additional code has been written on top of Persona to allow single-sign-on across all Webmaker tools and sites (e.g., [https://github.com/jbuck/node-webmaker-sso webmaker-sso]). When a new Webmaker account is created, the Persona email is stored, along with extra information about the user (e.g., name, email notification preferences, etc.). The username is also used to create a new (virtual) domain on '''makes.org''' (or '''mywebmaker.org''' in our staging environment). For example, user donald would get donald.makes.org. All published makes for this user (i.e., things created with Webmaker tools) will be available at ''username''.makes.org/''something''. The choice to use makes.org for hosting user content was done in order to provide origin-isolation from our Webmaker apps and code, which lives on webmaker.org (or mofostaging.net in our staging environment).
The ''username''.makes.org page is actually the '''Webmaker Profile''' app. Here all the user's makes are displayed, along with various widgets for creating new UI components in the profile. The Profile app, like webmaker.org, uses the '''Make API''' and '''Login''' servers in order to find all the makes for a particular user--in fact most Webmaker apps work this way. Communication between the Make API, Login server, and other node apps happens over HTTP APIs within in the production (or staging) deployment network.
 
Users create "makes" using Webmaker tools. All tools allow authenticated Webmaker users (i.e., must have account in the Login server) to publish what they make. Publishing means a number of things. First, user generated content from the tools (e.g., HTML) is saved to an [http://aws.amazon.com/s3/ Amazon S3 bucket]. A unique URL is also created, such that users can access their content again via their makes.org domain. The '''Make Valet''' app provides the routing and logic to map a URL to the content in S3, and common UI for details about a make (i.e., metadata from the Make API). Second, publishing means inserting a record into the Make API, which includes metadata about the make, like URL, date info, which tool was used, tags, etc. The Make API indexes makes using [http://www.elasticsearch.org/ Elastic Search] so that they can be found again easily.
 
Each of the Webmaker tools is a complex thing in its own right. Popcorn Maker publishes embeddable web pages, which are meant to be included via iframes. Thimble allows arbitrary HTML, CSS, and JavaScript to be combined into a single page. X-Ray Goggles allows the live DOM of a web page to be altered and then re-serialized to HTML so it can be published. All of the tools use the Login server for user authentication, S3 for publishing (each app does this step on its own, and in slightly different ways), and the Make API for indexing and metadata storage. Where possible common libraries and modules have been written and are shared across the tools, apps, and servers.
====A Tour of Webmaker Code====
* '''Make Valet''': https://github.com/mozilla/make-valet - node.js app for hosting information about makes (e.g., Make Details).
* '''Webmaker Profile''': https://github.com/mozilla/webmaker-profile - node.js app and front-end for ''username''.makes.org profile pages., includes:
** webmaker-profile-service: https://github.com/mozilla/webmaker-profile-service - RESTful API for profile
TODO
* list of all our git repos, owners/peers
* high-level diagram/description of how the pieces of Webmaker fit together
====Webmaker Style Guide====
Confirm
656
edits

Navigation menu