Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[Docs] Fix links in Basic Concepts #1158

Merged
merged 4 commits into from
Apr 24, 2019
Merged

[Docs] Fix links in Basic Concepts #1158

Changes from 3 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
312ebc9
Remove issue id from links and just redirect to project repo
jcalcaben Apr 23, 2019
8de2eee
Fix linting issues
jcalcaben Apr 23, 2019
cc3845d
Merge branch 'develop' into jimothy/gh-1157_fix-basic-concepts-page-l…
jcalcaben Apr 23, 2019
6c98bd8
Merge branch 'develop' into jimothy/gh-1157_fix-basic-concepts-page-l…
tjwiebell Apr 24, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
68 changes: 34 additions & 34 deletions pwa-devdocs/src/technologies/basic-concepts/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,85 +2,85 @@
title: Basic Concepts
---

The tools provided by the Magento PWA Studio project allows you to create websites that are fast, mobile-friendly, and reliable.
The tools provided by the Magento PWA Studio project allows you to create websites that are fast, mobile-friendly, and reliable.
This topic lists the basic concepts you need to know to work with the Magento PWA Studio tools.

## Application shell

An application shell provides the basic user interface structure for a progressive web application.
An application shell provides the basic user interface structure for a progressive web application.

For more information, see [Application shell][].

## Service worker

A service worker is a script that runs in the background.
Progressive web applications use service workers for caching and resource retrieval.
<sub>[ *[Help write this topic][Service Worker]* ]</sub>
Progressive web applications use service workers for caching and resource retrieval.
<sub>[ _[Help write this topic][service worker]_ ]</sub>

## Component data binding

Component data binding refers to the way data flows between the source and a UI component.
Progressive web applications use data binding patterns to connect dynamic data with the user interface.
<sub>[ *[Help write this topic][Component data binding]* ]</sub>
Progressive web applications use data binding patterns to connect dynamic data with the user interface.
<sub>[ _[Help write this topic][component data binding]_ ]</sub>

## GraphQL

GraphQL is a specification for a data query language client side and a service layer on the server side.
It is used to request and push data in a progressive web application.
It is used to request and push data in a progressive web application.

For more information, see [GraphQL][].

## CSS modules

CSS modules are modular and reusable CSS styles.
This allows you to develop components with styles that do not conflict with external style definitions.
This allows you to develop components with styles that do not conflict with external style definitions.

For more information, see [CSS modules][].

## Client state, reducers, and actions

Client state, reducers, and actions are [Redux] concepts used to manage and handle the state of a web application.
<sub>[ *[Help write this topic][Client state, reducers, and actions]* ]</sub>
Client state, reducers, and actions are [Redux][] concepts used to manage and handle the state of a web application.
<sub>[ _[Help write this topic][client state, reducers, and actions]_ ]</sub>

## Loading and offline states

Loading and offline are both states that must be handled by progressive web applications.
<sub>[ *[Help write this topic][Loading and offline states]* ]</sub>
Loading and offline are both states that must be handled by progressive web applications.
<sub>[ _[Help write this topic][loading and offline states]_ ]</sub>

## Container extensibility

Writing extensible containers allow others to re-use and alter your container without modifying the source.
Writing extensible containers allow others to re-use and alter your container without modifying the source.

For more information, see [Container extensibility].
For more information, see [Container extensibility][].
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This isn't rendering correctly in Markdown preview, and I'm having issues getting npm run start to run locally. Can you confirm this looks okay in rendered output (and maybe help me resolve my local error 😄 )


## Performance patterns

Performance is an important feature for a progressive web app.
There are many strategies and patterns available to help boost the performance of a PWA.
<sub>[ *[Help write this topic][Performance patterns]* ]</sub>
There are many strategies and patterns available to help boost the performance of a PWA.
<sub>[ _[Help write this topic][performance patterns]_ ]</sub>

## Root components and routing

The root component of an application is the DOM node under which all other nodes are managed by React.
Routing is the ability to map a URL pattern to the appropriate handler.
<sub>[ *[Help write this topic][Performance patterns]* ]</sub>
Routing is the ability to map a URL pattern to the appropriate handler.
<sub>[ _[Help write this topic][root components and routing]_ ]</sub>

## Critical path

The critical path for rendering refers to the steps the browser takes to process the HTML, CSS, and JavaScript files to display a website.
Optimizing the critical path is important to get the best performance out of a progressive web application.
<sub>[ *[Help write this topic][Critical path]* ]</sub>

[Redux]: https://redux.js.org/introduction/core-concepts

[Service worker]: {{ site.data.vars.repo }}/issues/14
[Component data binding]: {{ site.data.vars.repo }}/issues/9
[Client state, reducers, and actions]: {{ site.data.vars.repo }}/issues/12
[Loading and offline states]: {{ site.data.vars.repo }}/issues/13
[Container extensibility]: {{ site.baseurl }}{%link technologies/basic-concepts/container-extensibility/index.md %}
[Performance patterns]: {{ site.data.vars.repo }}/issues/16
[Root components and routing]: {{ site.data.vars.repo }}/issues/17
[Critical path]: {{ site.data.vars.repo }}/issues/18
[GraphQL]: {{ site.baseurl}}{%link technologies/basic-concepts/graphql/index.md %}
[CSS modules]: {{ site.baseurl }}{%link technologies/basic-concepts/css-modules/index.md %}
[Application shell]: {{site.baseurl}}{%link technologies/basic-concepts/app-shell/index.md %}
Optimizing the critical path is important to get the best performance out of a progressive web application.
<sub>[ _[Help write this topic][critical path]_ ]</sub>

[container extensibility]: {{ site.baseurl }}{%link technologies/basic-concepts/container-extensibility/index.md %}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This also doesn't render well, but I'm suspecting is just a markdown preview issue. Help me with my local, and I presume this is good to go.

[graphql]: {{ site.baseurl}}{%link technologies/basic-concepts/graphql/index.md %}
[css modules]: {{ site.baseurl }}{%link technologies/basic-concepts/css-modules/index.md %}
[application shell]: {{site.baseurl}}{%link technologies/basic-concepts/app-shell/index.md %}

[redux]: https://redux.js.org/introduction/core-concepts
[service worker]: https://github.com/magento-research/pwa-studio
[component data binding]: https://github.com/magento-research/pwa-studio
[client state, reducers, and actions]: https://github.com/magento-research/pwa-studio
[loading and offline states]: https://github.com/magento-research/pwa-studio
[performance patterns]: https://github.com/magento-research/pwa-studio
[root components and routing]: https://github.com/magento-research/pwa-studio
[critical path]: https://github.com/magento-research/pwa-studio