SAP UI5 & Fiori Masterclass

In this lecture, you will learn the fundamentals of HTML and HTML5, including the basic structure of an HTML document and the role of tags such as html, head, and body. You will also understand how browsers follow web standards and why HTML5 is important for modern web development. By the end of this lecture, you will be able to explain what HTML5 is and identify the key improvements it brings to modern web applications, including SAP Fiori apps.

In this lecture, you will learn the essential HTML tags used to structure a web page. You will work with document metadata, headings, comments, paragraphs, line breaks, text formatting, lists, and hyperlinks. By the end of this lecture, you will be able to build a well-structured HTML page and understand how basic content elements are organized in the browser.

In this lecture, you will learn how to work with more practical HTML elements such as images, audio, video, tables, and forms. You will understand how to display media content, organize data in tables, and collect user input through form controls. By the end of this lecture, you will be able to create richer and more interactive HTML pages using media, tables, and forms.

In this lecture, you will learn how to style a web page using inline CSS and internal CSS. You will start with a plain HTML page, then improve its appearance by applying colors, alignment, spacing, and layout changes. You will also learn how to use div containers and CSS classes to organize and style content more efficiently. By the end of this lecture, you will be able to apply inline and internal CSS and structure a webpage with reusable styling.

In this lecture, you will learn how to move your styles into an external CSS file to make your code cleaner, more reusable, and easier to maintain. You will create a separate CSS file, link it to your HTML page, and use both class and ID selectors to style elements. By the end of this lecture, you will be able to organize styles professionally using external CSS and understand the difference between margin, padding, classes, and IDs.

In this lecture, you will begin learning JavaScript and understand how it adds logic and interactivity to web pages. You will explore JavaScript engines in modern browsers, basic coding conventions, variable declaration with var and let, dynamic typing, and how to run code in the browser console. By the end of this lecture, you will be able to write simple JavaScript statements, declare variables, inspect data types, and print results in the console.

In this lecture, you will learn how to control program flow in JavaScript using if, else if, and else statements. You will practice checking conditions, handling multiple decision branches, and comparing values using both loose equality and strict equality operators. By the end of this lecture, you will be able to write decision-making logic in JavaScript and understand the important difference between == and ===.

In this lecture, you will learn how to store multiple values in JavaScript arrays and access them by index. By the end, you will be able to create, read, and work with arrays in practical examples.

In this lecture, you will learn how to repeat tasks using loops such as for loops in JavaScript. By the end, you will be able to loop through arrays and automate repetitive logic in your code.

In this lecture, you will learn what JSON is and how it is used to store and exchange data in JavaScript applications. You will create JSON objects and arrays, update properties, loop through them, and convert data with JSON.stringify and JSON.parse.

In this lecture, you will learn how to connect JavaScript with HTML to create dynamic web pages. By the end, you will be able to respond to user actions and update page content from JavaScript.

In this lecture, you will get an introduction to jQuery and see how it simplifies common JavaScript tasks such as selecting elements, handling events, and manipulating content.

In this lecture, you will learn how AJAX works and how to use it with jQuery to fetch and update data without refreshing the page. You will build a simple example that calls an external API and displays the response dynamically.

In this lecture, you will learn the concept of non-blocking I/O in JavaScript and why it is important for responsive web applications. You will compare blocking and non-blocking behavior and understand how JavaScript continues doing other work while waiting for long operations.

In this lecture, you will learn how to debug JavaScript code using Chrome Developer Tools. You will check console errors, set breakpoints, inspect variables, and step through your code line by line.

In this lecture, you will learn what Node.js is, why it is important in modern web development, and how it supports the SAPUI5 ecosystem. You will install Node.js, use NPM, initialize a project, and install dependencies such as Express.

In this lecture, you will learn how SAPUI5 tooling helps modernize and speed up SAPUI5 development. By the end, you will understand how tooling supports project setup, local serving, and development workflow.

In this lecture, you will build your first SAPUI5 application from scratch. You will learn the standard UI5 project structure, configure manifest.json, bootstrap SAPUI5, create a button, and run the app locally.

In this lecture, you will learn the MVC architecture in SAPUI5 and understand the roles of Model, View, and Controller. By the end, you will see how these three parts work together in a UI5 application.

In this lecture, you will explore the SAPUI5 SDK and learn how to use it as a reference for controls, APIs, samples, and official documentation. By the end, you will know how to find reliable help while developing UI5 apps.

In this lecture, you will learn how to create user interfaces in SAPUI5 using XML Views. By the end, you will be able to define controls in XML and understand why XML Views are widely used in UI5 development.

In this lecture, you will learn how controllers manage user interactions and business logic in SAPUI5. By the end, you will be able to connect a controller to a view and implement event-driven behavior.

In this lecture, you will learn the concept of aggregation in SAPUI5 and how parent controls manage child controls. By the end, you will understand how UI5 builds complex interfaces through nested controls.

In this lecture, you will learn what a model is in SAPUI5 and why it is essential for managing application data. By the end, you will be able to create and use a basic model in a UI5 app.

In this lecture, you will learn the different binding modes in SAPUI5, such as one-way, two-way, and one-time binding. By the end, you will understand when each mode should be used.

In this lecture, you will learn how to use expression binding in SAPUI5 to write simple logic directly in the view. By the end, you will be able to create concise and dynamic bindings.

In this lecture, you will learn how to combine multiple model properties into a single binding using composite binding. By the end, you will be able to produce more flexible output in your UI.

In this lecture, you will learn how to create bindings programmatically through JavaScript. By the end, you will understand when programmatic binding is useful and how it gives you more control.

In this lecture, you will learn how to organize SAPUI5 code into smaller reusable modules. By the end, you will be able to write cleaner and more maintainable application code.

In this lecture, you will learn how to work with multiple models in one SAPUI5 application using named models. By the end, you will be able to bind controls to the correct model explicitly.

In this lecture, you will learn how aggregation binding is used to connect collections of data with controls such as lists and tables. By the end, you will be able to display repeated records dynamically.

In this lecture, you will learn how the resource model is used for texts and internationalization in SAPUI5. By the end, you will be able to manage translatable labels and messages.

In this lecture, you will learn how element binding connects a UI container to one data object. By the end, you will be able to simplify data binding in forms and detail pages.

In this lecture, you will learn how to create and use a base controller to share reusable logic across multiple controllers. By the end, you will be able to reduce duplication in your project.

In this lecture, you will learn how to use simple formatter functions to customize how values are displayed in the user interface. By the end, you will be able to transform raw model data into user-friendly output.

In this lecture, you will learn how to build formatter functions that accept multiple arguments. By the end, you will be able to combine and format several values for display in SAPUI5 views.

In this lecture, you will begin creating a Fiori-style SAPUI5 application and understand the design principles behind Fiori apps. By the end, you will see how to structure a UI5 app to feel more like a real SAP Fiori application.

In this lecture, you will learn how the app container wraps and organizes the main layout of a SAPUI5 application. By the end, you will be able to structure the shell of a Fiori-style app.

In this lecture, you will continue building your Fiori-style application and expand the structure with additional controls and layout elements. By the end, your app will look more complete and closer to a real project.

In this lecture, you will learn how to work with page controls in SAPUI5. By the end, you will be able to configure page headers, titles, and content areas to create a clean application layout.

In this lecture, you will learn how to create and display a simple list in SAPUI5. By the end, you will be able to populate a list with items and use it in a practical UI scenario.

In this lecture, you will learn the purpose of manifest.json and why it is one of the most important files in a SAPUI5 application. By the end, you will understand how it stores metadata, configuration, and app settings.

In this lecture, you will learn how to bind list controls to model data in SAPUI5. By the end, you will be able to display dynamic data records in a list using binding syntax.

In this lecture, you will learn how to handle list events such as item press and selection in SAPUI5. By the end, you will be able to react to user interaction inside list-based UIs.

In this lecture, you will learn how list modes control selection and interaction behavior in SAPUI5 lists. By the end, you will be able to configure list behavior for different user scenarios.

In this lecture, you will learn how to filter list data in SAPUI5. By the end, you will be able to display only the records that match selected criteria.

In this lecture, you will learn how to create a split app layout for master-detail applications in SAPUI5. By the end, you will be able to organize content into separate navigation and detail areas.

In this lecture, you will learn how to use tab filters to switch between filtered views of data. By the end, you will be able to improve user navigation and filtering in list-driven apps.

In this lecture, you will learn the basics of routing in SAPUI5 and why it is essential for navigation between views. By the end, you will be able to define and use simple routes in your app.

In this lecture, you will configure routing for the home view of your application. By the end, you will be able to load the correct page automatically when the app starts

In this lecture, you will learn how route match handlers work in SAPUI5. By the end, you will be able to run logic when a specific route is matched.

In this lecture, you will learn how to keep master list selection synchronized with the currently displayed detail page. By the end, you will improve consistency in a master-detail navigation scenario.

In this lecture, you will learn how to work with the sap.m.Table control in SAPUI5. By the end, you will be able to display tabular data in a more structured and interactive way.

In this lecture, you will learn how to access and work with controls through the SAPUI5 core when needed. By the end, you will understand how core-level access can support control handling and application flow.

In this lecture, you will implement routing for a supplier detail scenario. By the end, you will be able to pass context through navigation and load the correct supplier information.

In this lecture, you will get an introduction to fragments in SAPUI5 and understand why they are useful for reusable UI parts. By the end, you will be able to create and load a simple fragment.

In this lecture, you will build a more advanced fragment and see how fragments can support richer user interactions. By the end, you will be able to use fragments for more complex UI scenarios.

In this lecture, you will get a clear introduction to OData and understand why it is widely used in SAP applications. By the end, you will know the role of OData in exchanging structured business data between frontend and backend.

In this lecture, you will learn the high-level architecture of SAP Fiori applications and how the frontend, OData services, and SAP backend systems work together. By the end, you will have a clearer view of the full Fiori landscape.

In this lecture, you will create your first OData service and understand the basic setup process. By the end, you will know how an OData service is exposed for frontend consumption.

In this lecture, you will learn what an EntitySet is in OData and how it represents collections of business objects. By the end, you will understand how EntitySets are used to expose data.

In this lecture, you will learn how pagination and filtering work in OData services. By the end, you will be able to manage large datasets more efficiently.

In this lecture, you will learn how to retrieve a single entity from an OData service. By the end, you will understand how to request one specific backend record.

In this lecture, you will learn how to create new records through an OData service. By the end, you will understand the request flow for create operations

In this lecture, you will learn how to update existing records through an OData service. By the end, you will understand how to send modified data back to the backend.

In this lecture, you will learn how to delete records through an OData service. By the end, you will understand how delete operations are handled in OData.

In this lecture, you will learn how associations define relationships between entities in OData. By the end, you will understand how linked business objects can be modeled and consumed together.

In this lecture, you will learn how function imports are used in OData to execute backend logic beyond standard CRUD operations. By the end, you will understand when and how to call custom backend functions.

In this lecture, you will learn what media entities are in OData and how they are used to handle file-like content. By the end, you will understand how binary or streamed content can be exposed through OData.