Skip to content
Permalink
master
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?

ionic-basics/index.html

Go to file
 
 
Cannot retrieve contributors at this time
138 lines (124 sloc) 7.23 KB
Raw Blame
Open in GitHub Desktop
<!doctype html>
<html class="no-js" lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Ionic Basics</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="apple-touch-icon" href="apple-touch-icon.png">
<!-- Place favicon.ico in the root directory -->
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">
<script src="js/vendor/modernizr-2.8.3.min.js"></script>
</head>
<body>
<!--[if lt IE 8]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<!-- Add your site or application content here -->
<!doctype html>
<html class="no-js" lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Ionic Basics</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="apple-touch-icon" href="apple-touch-icon.png">
<!-- Place favicon.ico in the root directory -->
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">
<script src="js/vendor/modernizr-2.8.3.min.js"></script>
</head>
<body>
<!--[if lt IE 8]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<!-- Add your site or application content here -->
<div id="first">
<h1>How to use Ionic:The Basics.</h1>
<ol>
<h3>Starting a New Project (Git Portion)</h3>
<li>Go to <a href="https://github.uconn.edu/btn15001">https://github.uconn.edu/btn15001</a></li>
<li>Click on "Repositories" and create a new one.</li>
<li>Open Desktop Command Terminal (Git Bash)</li>
<li>Type: <span class="code-font">git status</span> </li>
<li>Type: <span class="code-font">git cd</span> until you are at the desired folder. (<span class="code-font">cd .. </span>"to go back one folder")
<li>Now type: <span class="code-font">git clone</span> https://github.uconn.edu/your-netid/repository-name” (note: this requires that you have created a new repository on http://github.uconn.edu)</li>
<li>cd into that folder (it may need to be moved to a different location)</li>
<li>Copy and paste a new "Boilerplate" project into that folder</li>
<li>Go back to terminal and type: git status</li>
<li>Type: <span class="code-font">git add . </span>(Don't forget the dot)</li>
<li>Type:<span class="code-font"> git commit -a -m "My first commit"</span></li>
<li>Type:<span class="code-font"> git push -u origin master</span></li>
<li>Enter passwords</li>
<h3>Ionic Portion</h3>
<li>Type: <span class="code-font">ionic start </span>"name of app"<span class="code-font"> --v2</span></li>
<li>Type: <span class="code-font">ls </span>to view all directories</li>
<li>Type: <span class="code-font">cd </span>to change to that directory</li>
<li>Type: <span class="code-font">ls-l </span>to view all files in the directory</li>
<li>Type: <span class="code-font">ionic serve </span>to run/view app in webpage</li>
<li>To view project <a href="http://localhost:8100/ionic-lab">Click Here</a></li>
</ol>
</div>
<div id="second">
<div id="pages">
<ol>
<h3>Add Ionic Project to Git Hub</h3>
<li>Create a new Repo in Github but <strong>without</strong> a <em>README</em> file</li>
<li>Change the current working directory to your local project</li>
<li>Type:<span class="code-font">git init</span></li>
<li>Type:<span class="code-font">git add .</span></li>
<li>Type:<span class="code-font">git commit -m "first commit"</span></li>
<li>Type:<span class="code-font">git remote add origin <em>"link to Repo"</em></span></li>
<li>Type:<span class="code-font">git remote -v</span></li>
<li>Type:<span class="code-font">git push -u origin master</span></li>
</ol>
</div>
</div>
<div id="third">
<div id="branches1">
<ol>
<h3>Create a Page</h3>
<li>Type:<span class="code-font"> ionic g page </span>"name of page"</li>
<li> Here is a list of components to use when building pages <a href="https://ionicframework.com/docs/v2/components/#lists">https://ionicframework.com/docs/v2/components/#lists</a></li>
</ol>
<ol>
<h3>Uploading Project to Ionic site to Share</h3>
<li>Type:<span class="code-font"> ionic upload</span></li>
<li>Email and Password may show up</li>
<li>To view other projects/Apps <a href="https://apps.ionic.io/apps/">Click Here</a>
</ol>
</div>
</div>
<script src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.12.0.min.js"><\/script>')</script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
<script>
(function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
e=o.createElement(i);r=o.getElementsByTagName(i)[0];
e.src='https://www.google-analytics.com/analytics.js';
r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
ga('create','UA-XXXXX-X','auto');ga('send','pageview');
</script>
</body>
</html>
<script src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.12.0.min.js"><\/script>')</script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
<script>
(function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
e=o.createElement(i);r=o.getElementsByTagName(i)[0];
e.src='https://www.google-analytics.com/analytics.js';
r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
ga('create','UA-XXXXX-X','auto');ga('send','pageview');
</script>
</body>
</html>