Notes

https://github.com/nvm-sh/nvm
https://ionicframework.com/docs/
=================================================
For VS code Start:
=================================================
BMIIT201806100110020@bmiit:~/Documents$ code .
BMIIT201806100110020@bmiit:~/Documents$ ionic start
=====================================================
Right Way To open vs code:

BMIIT201806100110020@bmiit:~$ cd Desktop
BMIIT201806100110020@bmiit:~/Desktop$ cd VSCode-linux-x64/

BMIIT201806100110020@bmiit:~/Desktop/VSCode-linux-x64$ code .

Command 'code' not found, but can be installed with:

snap install code
Please ask your administrator.

BMIIT201806100110020@bmiit:~/Desktop/VSCode-linux-x64$ ./code

================================================================================
node installation process:
=========================================================
node -v
v8.17.0
BMIIT201806100110020@bmiit:~$ curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash
% Total % Received % Xferd Average Speed Time Time Time Current
Dload Upload Total Spent Left Speed
100 15037 100 15037 0 0 47286 0 --:--:-- --:--:-- --:--:-- 47286
=> Downloading nvm as script to '/bmiit/stud/201806100110020/.nvm'

=> Appending nvm source string to /bmiit/stud/201806100110020/.bashrc
=> Appending bash_completion source string to /bmiit/stud/201806100110020/.bashrc
export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")"
[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh" # This loads nvm
=> You currently have modules installed globally with `npm`. These will no
=> longer be linked to the active version of Node when you install a new node
=> with `nvm`; and they may (depending on how you construct your `$PATH`)
=> override the binaries of modules installed with `nvm`:

/usr/lib
+-- [email protected]
+-- [email protected]
=> If you wish to uninstall them at a later point (or re-install them under your
=> `nvm` Nodes), you can remove them from the system Node as follows:

$ nvm use system
$ npm uninstall -g a_module

=> Close and reopen your terminal to start using nvm or run the following to use it now:

export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh" # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && . "$NVM_DIR/bash_completion" # This loads nvm bash_completion
BMIIT201806100110020@bmiit:~$ export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")"
BMIIT201806100110020@bmiit:~$ [ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh" # This loads nvm
BMIIT201806100110020@bmiit:~$ nvm

Node Version Manager (v0.39.1)

Note: <version> refers to any version-like string nvm understands. This includes:
- full or partial version numbers, starting with an optional "v" (0.10, v0.1.2, v1)
- default (built-in) aliases: node, stable, unstable, iojs, system
- custom aliases you define with `nvm alias foo`

Any options that produce colorized output should respect the `--no-colors` option.

Usage:
nvm --help Show this message
--no-colors Suppress colored output
nvm --version Print out the installed version of nvm
nvm install [<version>] Download and install a <version>. Uses .nvmrc if available and version is omitted.
The following optional arguments, if provided, must appear directly after `nvm install`:
-s Skip binary download, install from source only.
-b Skip source download, install from binary only.
--reinstall-packages-from=<version> When installing, reinstall packages installed in <node|iojs|node version number>
--lts When installing, only select from LTS (long-term support) versions
--lts=<LTS name> When installing, only select from versions for a specific LTS line
--skip-default-packages When installing, skip the default-packages file if it exists
--latest-npm After installing, attempt to upgrade to the latest working npm on the given node version
--no-progress Disable the progress bar on any downloads
--alias=<name> After installing, set the alias specified to the version specified. (same as: nvm alias <name> <version>)
--default After installing, set default alias to the version specified. (same as: nvm alias default <version>)
nvm uninstall <version> Uninstall a version
nvm uninstall --lts Uninstall using automatic LTS (long-term support) alias `lts/*`, if available.
nvm uninstall --lts=<LTS name> Uninstall using automatic alias for provided LTS line, if available.
nvm use [<version>] Modify PATH to use <version>. Uses .nvmrc if available and version is omitted.
The following optional arguments, if provided, must appear directly after `nvm use`:
--silent Silences stdout/stderr output
--lts Uses automatic LTS (long-term support) alias `lts/*`, if available.
--lts=<LTS name> Uses automatic alias for provided LTS line, if available.
nvm exec [<version>] [<command>] Run <command> on <version>. Uses .nvmrc if available and version is omitted.
The following optional arguments, if provided, must appear directly after `nvm exec`:
--silent Silences stdout/stderr output
--lts Uses automatic LTS (long-term support) alias `lts/*`, if available.
--lts=<LTS name> Uses automatic alias for provided LTS line, if available.
nvm run [<version>] [<args>] Run `node` on <version> with <args> as arguments. Uses .nvmrc if available and version is omitted.
The following optional arguments, if provided, must appear directly after `nvm run`:
--silent Silences stdout/stderr output
--lts Uses automatic LTS (long-term support) alias `lts/*`, if available.
--lts=<LTS name> Uses automatic alias for provided LTS line, if available.
nvm current Display currently activated version of Node
nvm ls [<version>] List installed versions, matching a given <version> if provided
--no-colors Suppress colored output
--no-alias Suppress `nvm alias` output
nvm ls-remote [<version>] List remote versions available for install, matching a given <version> if provided
--lts When listing, only show LTS (long-term support) versions
--lts=<LTS name> When listing, only show versions for a specific LTS line
--no-colors Suppress colored output
nvm version <version> Resolve the given description to a single local version
nvm version-remote <version> Resolve the given description to a single remote version
--lts When listing, only select from LTS (long-term support) versions
--lts=<LTS name> When listing, only select from versions for a specific LTS line
nvm deactivate Undo effects of `nvm` on current shell
--silent Silences stdout/stderr output
nvm alias [<pattern>] Show all aliases beginning with <pattern>
--no-colors Suppress colored output
nvm alias <name> <version> Set an alias named <name> pointing to <version>
nvm unalias <name> Deletes the alias named <name>
nvm install-latest-npm Attempt to upgrade to the latest working `npm` on the current node version
nvm reinstall-packages <version> Reinstall global `npm` packages contained in <version> to current version
nvm unload Unload `nvm` from shell
nvm which [current | <version>] Display path to installed node version. Uses .nvmrc if available and version is omitted.
--silent Silences stdout/stderr output when a version is omitted
nvm cache dir Display path to the cache directory for nvm
nvm cache clear Empty cache directory for nvm
nvm set-colors [<color codes>] Set five text colors using format "yMeBg". Available when supported.
Initial colors are:
g b y r e
Color codes:
r/R = red / bold red
g/G = green / bold green
b/B = blue / bold blue
c/C = cyan / bold cyan
m/M = magenta / bold magenta
y/Y = yellow / bold yellow
k/K = black / bold black
e/W = light grey / white

Example:
nvm install 8.0.0 Install a specific version number
nvm use 8.0 Use the latest available 8.0.x release
nvm run 6.10.3 app.js Run app.js using node 6.10.3
nvm exec 4.8.3 node app.js Run `node app.js` with the PATH pointing to node 4.8.3
nvm alias default 8.1.0 Set default node version on a shell
nvm alias default node Always default to the latest available node version on a shell

nvm install node Install the latest available version
nvm use node Use the latest version
nvm install --lts Install the latest LTS version
nvm use --lts Use the latest LTS version

nvm set-colors cgYmW Set text colors to cyan, green, bold yellow, magenta, and white

Note:
to remove, delete, or uninstall nvm - just remove the `$NVM_DIR` folder (usually `~/.nvm`)

BMIIT201806100110020@bmiit:~$ nvm install 16.15.1
Downloading and installing node v16.15.1...
Downloading https://nodejs.org/dist/v16.15.1/node-v16.15.1-linux-x64.tar.xz...
######################################################################### 100.0%
Computing checksum with sha256sum
Checksums matched!
Now using node v16.15.1 (npm v8.11.0)
Creating default alias: default -> 16.15.1 (-> v16.15.1)
BMIIT201806100110020@bmiit:~$ npm install @ionic/cli
npm WARN old lockfile
npm WARN old lockfile The package-lock.json file was created with an old version of npm,
npm WARN old lockfile so supplemental metadata must be fetched from the registry.
npm WARN old lockfile
npm WARN old lockfile This is a one-time fix-up, please be patient...
npm WARN old lockfile
npm WARN deprecated [email protected]: Please upgrade to latest, formidable@v2 or formidable@v3! Check these notes: https://bit.ly/2ZEqIau
npm WARN deprecated [email protected]: Please upgrade to v7.0.2+ of superagent. We have fixed numerous issues with streams, form-data, attach(), filesystem errors not bubbling up (ENOENT on attach()), and all tests are now passing. See the releases tab for more information at <https://github.com/visionmedia/superagent/releases>.

added 217 packages, removed 206 packages, and audited 218 packages in 16s

26 packages are looking for funding
run `npm fund` for details

found 0 vulnerabilities
npm notice
npm notice New minor version of npm available! 8.11.0 -> 8.13.1
npm notice Changelog: https://github.com/npm/cli/releases/tag/v8.13.1
npm notice Run npm install -g [email protected] to update!
npm notice
BMIIT201806100110020@bmiit:~$ cd Documents/
BMIIT201806100110020@bmiit:~/Documents$ ionic start MyApp

Pick a framework! 😁

Please select the JavaScript framework to use for your new app. To bypass this
prompt next time, supply a value for the --type option.

? Framework:
❯ Angular | https://angular.io
React | https://reactjs.org
[1]+ Stopped ionic start MyApp
BMIIT201806100110020@bmiit:~/Documents$ node-v
node-v: command not found
BMIIT201806100110020@bmiit:~/Documents$ node -v
v16.15.1
BMIIT201806100110020@bmiit:~/Documents$ ionic start MyApp

Pick a framework! 😁

Please select the JavaScript framework to use for your new app. To bypass this
prompt next time, supply a value for the --type option.

? Framework: Angular

Let's pick the perfect starter template! 💪

Starter templates are ready-to-go Ionic apps that come packed with everything
you need to build your app. To bypass this prompt next time, supply template,
the second argument to ionic start.

? Starter template: blank
✔ Preparing directory ./MyApp - done!
✔ Downloading and extracting blank starter - done!

Installing dependencies may take several minutes.

──────────────────────────────────────────────────────────────────────

Ionic Enterprise, platform and solutions for teams by Ionic

Powerful library of native APIs ⚡
A supercharged platform for teams 💪

👉 https://ion.link/enterprise 👈

──────────────────────────────────────────────────────────────────────


> npm i
npm WARN deprecated [email protected]: this library is no longer supported
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-resolve#deprecated
npm WARN deprecated [email protected]: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances, which is known to be problematic. See https://v8.dev/blog/math-random for details.
npm WARN deprecated [email protected]: request has been deprecated, see https://github.com/request/request/issues/3142

added 1293 packages, and audited 1294 packages in 33s

155 packages are looking for funding
run `npm fund` for details

found 0 vulnerabilities

[INFO] Next Steps:

- Go to your newly created project: cd ./MyApp
- Run ionic serve within the app directory to see your app
- Build features and components: https://ion.link/scaffolding-docs
- Run your app on a hardware or virtual device:
https://ion.link/running-docs
BMIIT201806100110020@bmiit:~/Documents$

========================================================================================================================================
Receipe Application:
========================================================================================================================================

=>=>
first create recipe page/folder with help of ionic generate command
==============================================================
After that change into app-routing.module.ts file:

{
path: '',
redirectTo: 'recipe', <!--in this double conation text change-->
pathMatch: 'full'
},

===============================================================

recipe.models.ts
============================================================
this file create in recipe folder

export interface Recipe
{
id: string;
title: string;
imageUrl: string;
ingredients: string[];
}
============================================================
recipe.page.ts
=========================================
export class RecipePage implements OnInit {
recipes: Recipe[]=[
{
id: 'r1',
title: 'Panner Butter Masala',
imageUrl: '',
ingredients: ['Panner','Butter','spices']
},
{
id: 'r2',
title: 'Pitzza',
imageUrl: '',
ingredients: ['Chese','wheat','spices']
}
];
}
==========================================

recipe.page.html
=============================
<ion-header>
<ion-toolbar>
<ion-title>Recipe</ion-title>
</ion-toolbar>
</ion-header>

<ion-content>
<ion-list *ngFor="let recipe of recipes">
<ion-item>
<ion-avatar slot="start">
<ion-img [src]="recipe.imageUrl"></ion-img>
</ion-avatar>
<ion-label>{{recipe.title}}</ion-label>
</ion-item>
</ion-list>
</ion-content>

=================================================
All Video link:
==================================================

Ionic Recipe Application
https://www.youtube.com/watch?v=iLxJQpOKQq4

Ionic Storage
https://www.youtube.com/watch?v=vCfAe2esboU

Ionic geolocation
https://www.youtube.com/watch?v=Ru57AkoWMJ4

Ionic UI Component Playlist
https://www.youtube.com/playlist?list=PLeEImLH0g06Degx9g6A_MnJbfHLKKwKj8

Ionic Services
https://www.youtube.com/watch?v=a0VPONbh6RU

Ionic HTTP/API
https://www.youtube.com/watch?v=X0J1PsJXQfs

Ionic UI Component Documentation
https://ionicframework.com/docs/components

========================================================