Commit ef7ca404 authored by Michael's avatar Michael
Browse files

Init mkdocs documentation

parent 7b4e992a
# Configuration
In this section we wille lear how to edit appbase ionic conf.
The main config file is located at `www/app/conf/ConfParams.js`.
## Setup api endpoint : API_ENDPOINT
That config make the link between the mobile app and the REST api.
* Manually
Edit `www/app/conf/ConfParams.js` and change the value of `API_ENDPOINT` constant.
* Using grunt
The default grunt task can be used to edit `ConfParams.js` via env vars.
It use [ngconstant](https://github.com/werk85/grunt-ng-constant) grunt plugin to edit de conf file.
Example :
```
export API_ENDPOINT=http://your-server-with-appbase.org/api
grunt && ionic serve --lab
```
### Getting started with App Base
App Base is your production ready mobile app foundation.
Its the result of two framworks combined to create a powerfull fullsatck js ecosystem.
### App Base projects
| Need |Solution| AppBase repo |
|---|---|---|
|REST API|[LoopBack Framework](https://strongloop.com/node-js/loopback-framework)|[Appbase server](https://github.com/lab-241/appbase-server)|
|Mobile App|[Ionic Framework](http://ionicframework.com/)|[Appbase ionic](https://github.com/lab-241/appbase-client-ionic)|
|Admin Dashboard|[NG-admin](https://github.com/marmelab/ng-admin)|[Appbase server](https://github.com/lab-241/appbase-server)|
### Development quick start
__Prerequites__
* [NodeJs](https://nodejs.org/en/download/package-manager)
__Install dev tools__
App base is built on top of ionic (who use cordova) and strongloop.
Some others automation tools (like gulp) are required.
```
npm install -g cordova ionic strongloop grunt-cli gulp bower karma-cli phantomjs
```
__Start app components__
* Start loopback REST api server
```
$ git clone git@git.mikangali.com:lab-241/appbase-server
$ cd appbase-server
$ npm install
$ grunt
```
Server is running at `http://localhost:3000`
* Start ionic mobile app
```
$ git clone git@git.mikangali.com:lab-241/appbase-client-ionic
$ cd appbase-client-ionic
$ bower install
$ ionic serve --lab
# Run ionic app on android
$ ionic platform android
$ ionic run android --livereload
```
## Links
* [Project website](http://appbase.ga)
* [Github repo](https://github.com/lab-241/appbase)
* [Slides show](https://slides.com/mikamboo/app-base/edit)
\ No newline at end of file
### mobile App configuration
\ No newline at end of file
### REST api server installation
\ No newline at end of file
### REST api server installation
\ No newline at end of file
### Mobile app installation
\ No newline at end of file
site_name: App Base
dev_addr: 0.0.0.0:9001
theme: flatly
pages:
- Getting Started: index.md
- Server:
- server/install.md
- server/configure.md
- Ionic:
- ionic/install.md
- ionic/configure.md
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
{% if page_description %}<meta name="description" content="{{ page_description }}">{% endif %}
{% if site_author %}<meta name="author" content="{{ site_author }}">{% endif %}
{% if canonical_url %}<link rel="canonical" href="{{ canonical_url }}">{% endif %}
{% if favicon %}<link rel="shortcut icon" href="{{ favicon }}">
{% else %}<link rel="shortcut icon" href="{{ base_url }}/img/favicon.ico">{% endif %}
<title>{% if page_title %}{{ page_title }} - {% endif %}{{ site_name }}</title>
<link href="{{ base_url }}/css/bootstrap-custom.min.css" rel="stylesheet">
<link href="{{ base_url }}/css/font-awesome-4.0.3.css" rel="stylesheet">
<link rel="stylesheet" href="{{ base_url }}/css/highlight.css">
<link href="{{ base_url }}/css/base.css" rel="stylesheet">
{%- for path in extra_css %}
<link href="{{ path }}" rel="stylesheet">
{%- endfor %}
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
{% if google_analytics %}
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', '{{ google_analytics[0] }}', '{{ google_analytics[1] }}');
ga('send', 'pageview');
</script>
{% endif %}
</head>
<body>
{% include "nav.html" %}
<div class="container">
<div class="col-md-3">{% include "toc.html" %}</div>
<div class="col-md-9" role="main">{% include "content.html" %}</div>
</div>
<footer class="col-md-12">
<hr>
{% if copyright %}
<center>{{ copyright }}</center>
{% endif %}
<center>Documentation built with <a href="http://www.mkdocs.org/">MkDocs</a>.</center>
</footer>
<script src="{{ base_url }}/js/jquery-1.10.2.min.js"></script>
<script src="{{ base_url }}/js/bootstrap-3.0.3.min.js"></script>
<script src="{{ base_url }}/js/highlight.pack.js"></script>
<script>var base_url = '{{ base_url }}';</script>
<script data-main="{{ base_url }}/mkdocs/js/search.js" src="{{ base_url }}/mkdocs/js/require.js"></script>
<script src="{{ base_url }}/js/base.js"></script>
{%- for path in extra_javascript %}
<script src="{{ path }}"></script>
{%- endfor %}
<div class="modal" id="mkdocs_search_modal" tabindex="-1" role="dialog" aria-labelledby="Search Modal" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="exampleModalLabel">Search</h4>
</div>
<div class="modal-body">
<p>
From here you can search these documents. Enter
your search terms below.
</p>
<form role="form">
<div class="form-group">
<input type="text" class="form-control" placeholder="Search..." id="mkdocs-search-query">
</div>
</form>
<div id="mkdocs-search-results"></div>
</div>
<div class="modal-footer">
</div>
</div>
</div>
</div>
</body>
</html>
{% if meta.source %}
<div class="source-links">
{% for filename in meta.source %}
<span class="label label-primary">{{ filename }}</span>
{% endfor %}
</div>
{% endif %}
{{ content }}
body {
padding-top: 70px;
}
/*
* The code below adds some padding to the top of the current anchor target so
* that, when navigating to it, the header isn't hidden by the navbar at the
* top. This is especially complicated because we want to *remove* the padding
* after navigation so that hovering over the header shows the permalink icon
* correctly. Thus, we create a CSS animation to remove the extra padding after
* a second. We have two animations so that navigating to an anchor within the
* page always restarts the animation.
*
* See <https://github.com/mkdocs/mkdocs/issues/843> for more details.
*/
:target::before {
content: "";
display: block;
margin-top: -75px;
height: 75px;
pointer-events: none;
animation: 0s 1s forwards collapse-anchor-padding-1;
}
body.clicky :target::before {
animation-name: collapse-anchor-padding-2;
}
@keyframes collapse-anchor-padding-1 {
to {
margin-top: 0;
height: 0;
}
}
@keyframes collapse-anchor-padding-2 {
to {
margin-top: 0;
height: 0;
}
}
ul.nav li.main {
font-weight: bold;
}
div.col-md-3 {
padding-left: 0;
}
div.col-md-9 {
padding-bottom: 100px;
}
div.source-links {
float: right;
}
div.col-md-9 img {
max-width: 100%;
}
code {
padding: 1px 3px;
background: #ecf0f1;
border: solid 1px #ccc;
color: #7b8a8b;
}
pre code {
background: transparent;
border: none;
}
a > code {
color: #18bc9c;
}
/*
* Side navigation
*
* Scrollspy and affixed enhanced navigation to highlight sections and secondary
* sections of docs content.
*/
/* By default it's not affixed in mobile views, so undo that */
.bs-sidebar.affix {
position: static;
}
.bs-sidebar.well {
padding: 0;
}
/* First level of nav */
.bs-sidenav {
margin-top: 30px;
margin-bottom: 30px;
padding-top: 10px;
padding-bottom: 10px;
border-radius: 5px;
}
/* All levels of nav */
.bs-sidebar .nav > li > a {
display: block;
padding: 5px 20px;
z-index: 1;
}
.bs-sidebar .nav > li > a:hover,
.bs-sidebar .nav > li > a:focus {
text-decoration: none;
border-right: 1px solid;
}
.bs-sidebar .nav > .active > a,
.bs-sidebar .nav > .active:hover > a,
.bs-sidebar .nav > .active:focus > a {
font-weight: bold;
background-color: transparent;
border-right: 1px solid;
}
/* Nav: second level (shown on .active) */
.bs-sidebar .nav .nav {
display: none; /* Hide by default, but at >768px, show it */
margin-bottom: 8px;
}
.bs-sidebar .nav .nav > li > a {
padding-top: 3px;
padding-bottom: 3px;
padding-left: 30px;
font-size: 90%;
}
/* Show and affix the side nav when space allows it */
@media (min-width: 992px) {
.bs-sidebar .nav > .active > ul {
display: block;
}
/* Widen the fixed sidebar */
.bs-sidebar.affix,
.bs-sidebar.affix-bottom {
width: 213px;
}
.bs-sidebar.affix {
position: fixed; /* Undo the static from mobile first approach */
top: 80px;
}
.bs-sidebar.affix-bottom {
position: absolute; /* Undo the static from mobile first approach */
}
.bs-sidebar.affix-bottom .bs-sidenav,
.bs-sidebar.affix .bs-sidenav {
margin-top: 0;
margin-bottom: 0;
}
}
@media (min-width: 1200px) {
/* Widen the fixed sidebar again */
.bs-sidebar.affix-bottom,
.bs-sidebar.affix {
width: 263px;
}
}
.headerlink {
display: none;
padding-left: .5em;
}
h1:hover .headerlink, h2:hover .headerlink, h3:hover .headerlink, h4:hover .headerlink, h5:hover .headerlink, h6:hover .headerlink{
display:inline-block;
}
/* display submenu relative to parent*/
.dropdown-submenu {
position: relative;
}
/* sub menu stlye */
.dropdown-submenu>.dropdown-menu {
top: 0;
left: 100%;
margin-top: 0px;
margin-left: -1px;
-webkit-border-radius: 0 4px 4px 4px;
-moz-border-radius: 0 4px 4px;
border-radius: 0 4px 4px 4px;
}
/* display sub menu on hover*/
.dropdown-submenu:hover>.dropdown-menu {
display: block;
}
/* little arrow */
.dropdown-submenu>a:after {
display: block;
content: " ";
float: right;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
border-width: 5px 0 5px 5px;
border-left-color: #ccc;
margin-top: 5px;
margin-right: -10px;
}
/* little arrow of parent menu */
.dropdown-submenu:hover>a:after {
border-left-color: #404040;
}
This diff is collapsed.
This diff is collapsed.
/*
This is the GitHub theme for highlight.js
github.com style (c) Vasily Polovnyov <vast@whiteants.net>
*/
.hljs {
display: block;
overflow-x: auto;
padding: 0.5em;
color: #333;
-webkit-text-size-adjust: none;
}
.hljs-comment,
.diff .hljs-header,
.hljs-javadoc {
color: #998;
font-style: italic;
}
.hljs-keyword,
.css .rule .hljs-keyword,
.hljs-winutils,
.nginx .hljs-title,
.hljs-subst,
.hljs-request,
.hljs-status {
color: #333;
font-weight: bold;
}
.hljs-number,
.hljs-hexcolor,
.ruby .hljs-constant {
color: #008080;
}
.hljs-string,
.hljs-tag .hljs-value,
.hljs-phpdoc,
.hljs-dartdoc,
.tex .hljs-formula {
color: #d14;
}
.hljs-title,
.hljs-id,
.scss .hljs-preprocessor {
color: #900;
font-weight: bold;
}
.hljs-list .hljs-keyword,
.hljs-subst {
font-weight: normal;
}
.hljs-class .hljs-title,
.hljs-type,
.vhdl .hljs-literal,
.tex .hljs-command {
color: #458;
font-weight: bold;
}
.hljs-tag,
.hljs-tag .hljs-title,
.hljs-rule .hljs-property,
.django .hljs-tag .hljs-keyword {
color: #000080;
font-weight: normal;
}
.hljs-attribute,
.hljs-variable,
.lisp .hljs-body,
.hljs-name {
color: #008080;
}
.hljs-regexp {
color: #009926;
}
.hljs-symbol,
.ruby .hljs-symbol .hljs-string,
.lisp .hljs-keyword,
.clojure .hljs-keyword,
.scheme .hljs-keyword,
.tex .hljs-special,
.hljs-prompt {
color: #990073;
}
.hljs-built_in {
color: #0086b3;
}
.hljs-preprocessor,
.hljs-pragma,
.hljs-pi,
.hljs-doctype,
.hljs-shebang,
.hljs-cdata {
color: #999;
font-weight: bold;
}
.hljs-deletion {
background: #fdd;
}
.hljs-addition {
background: #dfd;
}
.diff .hljs-change {
background: #0086b3;
}
.hljs-chunk {
color: #aaa;
}
This diff is collapsed.
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment