- Ionic Cookbook
- Hoc Phan
- 250字
- 2021-07-09 21:15:10
Copying examples from Ionic Codepen Demos
Sometimes it's easier to just get snippets of code from the example library. Ionic Codepen Demos (http://codepen.io/ionic/public-list/) is a great website to visit. Codepen.io is a playground (or sandbox) to demonstrate and learn web development. There are other alternatives such as plnkr.com or jsfiddle.com. It's just a developer's personal preference which one to choose.
However, all Ionic's demos are already available on Codepen, where you can experiment and clone to your own account. http://plnkr.com has an existing AngularJS boilerplate and could be used to just practice specific AngularJS areas because you can copy the link of sample code and post on Stackoverflow.com if you have questions.
How to do it…
There are several tags of interest to browse through if you want specific UI component examples:

You don't need a Codepen account to view. However, if there is a need to save a custom pen and share with others, free registration will be required.
The Ionic Codepen Demos site has more collections of demos comparing to the CLI. Some are based on a nightly build of the platform so they could be unstable to use.
There's more...
You can find the same side menu example on this site:
- Navigate to http://codepen.io/ionic/public-list/ from your browser.
- Select Tag: menus and then click on Side Menu and Navigation: Nightly.
- Change the layout to fit a proper mobile screen by clicking on the first icon of the layout icons row on the bottom right of the screen.
- Google Flutter Mobile Development Quick Start Guide
- Node.js 10實(shí)戰(zhàn)
- Learning PostgreSQL
- JavaScript Unlocked
- Mastering Scientific Computing with R
- Python 3破冰人工智能:從入門到實(shí)戰(zhàn)
- The Data Visualization Workshop
- 軟件架構(gòu):Python語言實(shí)現(xiàn)
- SQL基礎(chǔ)教程(視頻教學(xué)版)
- Spring Boot企業(yè)級項(xiàng)目開發(fā)實(shí)戰(zhàn)
- Java:High-Performance Apps with Java 9
- jQuery技術(shù)內(nèi)幕:深入解析jQuery架構(gòu)設(shè)計(jì)與實(shí)現(xiàn)原理
- QlikView Unlocked
- 跟戴銘學(xué)iOS編程:理順核心知識點(diǎn)
- Spark技術(shù)內(nèi)幕:深入解析Spark內(nèi)核架構(gòu)設(shè)計(jì)與實(shí)現(xiàn)原理