Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/ova2/angular-development-with-primeng

Code samples from the book "Angular UI Development with PrimeNG"
https://github.com/ova2/angular-development-with-primeng

angular2 angular4 packtpub primeng setup-primeng typescript ui-components

Last synced: about 1 month ago
JSON representation

Code samples from the book "Angular UI Development with PrimeNG"

Awesome Lists containing this project

README 

        
### Angular UI Development with PrimeNG



Written by [Oleg Varaksin](https://github.com/ova2) and [Sudheer Jonna](https://github.com/sudheerj). Powered by the dream team - __Angular 4__ and __PrimeNG 4__. :dizzy:



__Book on Packt's website:__ https://www.packtpub.com/web-development/learning-angular-ui-development-primeng



__Table of Contents__



* [Chapter 1, Getting Started with Angular and PrimeNG](https://github.com/ova2/angular-development-with-primeng/tree/master/chapter1)

  * TypeScript fundamentals you need to know

  * Advanced types, decorators, compiler options

  * Angular cheat sheet: overview of key concepts

  * Angular modularity and lifecycle hooks

  * Running PrimeNG with SystemJS

  * Setup PrimeNG project with Webpack

  * Setup PrimeNG project with Angular CLI

  

* [Chapter 2, Theming Concept and Layouts](https://github.com/ova2/angular-development-with-primeng/tree/master/chapter2)

  * Understanding structural and skinning CSS

  * Organize your project structure with Sass

  * Simple ways to create a new theme

  * Responsive grid system in PrimeNG

  * Bootstrap flexbox layout meets PrimeNG

  

* [Chapter 3, Enhanced Inputs and Selects](https://github.com/ova2/angular-development-with-primeng/tree/master/chapter3)

  * Formatted input with InputMask

  * Auto suggestion with AutoComplete

  * Entering multiple values with Chips

  * Discovering checkbox: Boolean, Many and TriState

  * Choosing items with single and multi select components

  * Basic and advanced calendar scenarios

  * Spinner and Slider – different ways to provide input

  * Text editing with rich and in-place editors

  * Password and star-based rating inputs

  * Validation with Input and Select components

  

* [Chapter 4, Button and Panel Components](https://github.com/ova2/angular-development-with-primeng/tree/master/chapter4)

  * Enhanced Button, RadioButton and SplitButton

  * Selecting value by ToggleButton and SelectButton

  * Grouping buttons with Toolbar

  * Arrange your view with Panels and Fieldsets

  * Vertical stacked panels with Accordion

  * Grouping content with tabs in TabView

  

* [Chapter 5, Data Iteration Components](https://github.com/ova2/angular-development-with-primeng/tree/master/chapter5)

  * Multi feature DataTable

  * Selecting rows in DataTable

  * Sorting, filtering and paginating data in DataTable

  * Customizing cell content with templating

  * Resizing, reordering and toggling columns in DataTable

  * In-cell editing with DataTable

  * Making DataTable responsive

  * Using column and row grouping

  * Handling tons of data with lazy DataTable

  * Row expansion by providing row template

  * Export data in CSV format

  * DataTable events and methods

  * Listing data with DataList

  * Listing data with PickList

  * Listing data with OrderList

  * Grid-organized data with DataGrid

  * On demand data loading with DataScroller

  * Visualizing data with Tree

  * Visualizing data with TreeTable

  * Managing events with Schedule

  

* [Chapter 6, Amazing Overlays and Messages](https://github.com/ova2/angular-development-with-primeng/tree/master/chapter6)

  * Displaying content in Dialog

  * Displaying content in Lightbox

  * Multipurpose scenarios with OverlayPanel

  * Notifying users with Messages and Growl

  * Tooltips for form components

  

* [Chapter 7, Endless Menu Variations](https://github.com/ova2/angular-development-with-primeng/tree/master/chapter7)

  * Statically and dynamically positioned menus

  * Creating programmatic menus by MenuModel

  * Accessing commands via Menubar

  * ContextMenu with nested items

  * SlideMenu – menu in the iPod style

  * TieredMenu – submenus in nested overlays

  * MegaMenu – the multicolumn menu

  * PanelMenu – hybrid of accordion and tree

  * TabMenu - menu items as tabs

  * Breadcrumb – providing contextual information about page hierarchy

  

* [Chapter 8, Creating Charts and Maps](https://github.com/ova2/angular-development-with-primeng/tree/master/chapter8)

  * Working with chart model

  * Data representation with line and bar charts

  * Data representation with pie and doughnut charts

  * Data representation with radar and polar area charts

  * Drawing organization chart for relationship hierarchy

  * Basic integration with Google Map API

  * Various use cases with GMap component

  

* [Chapter 9, Miscellaneous Use Cases and Best Practices](https://github.com/ova2/angular-development-with-primeng/tree/master/chapter9)

  * File uploading in all its glory

  * Learning Draggable and Droppable directives

  * Displaying collection of images with Galleria

  * CRUD sample implementation with DataTable

  * Deferring mechanism to optimize page loading

  * Blocking page pieces during long-running AJAX calls

  * Process status indicator in action

  * Selecting colors with ColorPicker

  * Displaying confirmation dialog with guarded routes

  * Implementing custom wizard component with Steps

  * Introduction to state management with @ngrx/store

  

* [Chapter 10, Creating Robust Applications](https://github.com/ova2/angular-development-with-primeng/tree/master/chapter10)

  * Setting up unit testing with Jasmine and Karma

  * Unit testing of Components and Services

  * Tip how to speed up unit testing

  * Setting up e2e test environment with Protractor

  * Writing automated UI tests at a glance

  * Exploring PrimeNG application with Augury and ng.probe



__Additional Resources__:



 1. The Angular's official internationalization support powered by PrimeNG components is explained in

 [this blog post](http://sudheerjonna.com/blog/2017/07/09/angulars-official-internationalizationi18n-support/)

  and the GitHub project is available here: https://github.com/sudheerj/angular-primeng-i18n

 2. The internationalization support for Angular and PrimeNG using __ngx-translate__ is explained in

 [this blog post](http://sudheerjonna.com/blog/2017/06/26/angular-and-primeng-internationalization-using-ng2-translate/)

 and the GitHub project is available here: https://github.com/sudheerj/angular-primeng-ngxtranslate

 3. PrimeNG 4.1 RELEASE changes(new components, new features, bug fixes and improvements) are explained in

 [this blog post](http://sudheerjonna.com/blog/2017/06/26/whats-new-in-primeng-4-1-release//) and the GitHub project is avialable here: https://github.com/sudheerj/primeng-4.1

 4. The PrimeNG dataTable supporting JSON nested structure is explained in

  [this blog post](http://sudheerjonna.com/blog/2017/07/06/nested-json-structure-usage-with-primeng-datatable/)

  and the GitHub project is available here: https://github.com/sudheerj/Datatable-NestedJSON

  5. JHipster-PrimeNG module is explained in [this blog post](http://sudheerjonna.com/blog/2017/10/09/jhipster-meets-primeng-or-primeng-meets-jhipster/) and the GitHub project is available here:  https://github.com/sudheerj/generator-jhipster-primeng