Angular UI Development with PrimeNG
Written by Oleg Varaksin and Sudheer Jonna. 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
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- 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:
- The Angular's official internationalization support powered by PrimeNG components is explained in
this blog post
and the GitHub project is available here: https://github.com/sudheerj/angular-primeng-i18n
- The internationalization support for Angular and PrimeNG using ngx-translate is explained in
this blog post
and the GitHub project is available here: https://github.com/sudheerj/angular-primeng-ngxtranslate
- PrimeNG 4.1 RELEASE changes(new components, new features, bug fixes and improvements) are explained in
this blog post and the GitHub project is avialable here: https://github.com/sudheerj/primeng-4.1
- The PrimeNG dataTable supporting JSON nested structure is explained in
this blog post
and the GitHub project is available here: https://github.com/sudheerj/Datatable-NestedJSON
- JHipster-PrimeNG module is explained in this blog post and the GitHub project is available here: https://github.com/sudheerj/generator-jhipster-primeng