Posts

Employee Management System with Angular

-
Image
Introduction In this tutorial, we will build an Employee Management System using Angular. This exercise demonstrates essential Angular concepts, including Angular Components, Data Binding, Interpolation, Property Binding, Event Binding, Two-way Data Binding, and Child/Nested Components. Objective Create an Employee Management System that allows you to manage a list of employees, demonstrating key Angular concepts. Requirements 1. Main Application Component Set up a new Angular project. Create the main application component. 2. Employee List Component Create `EmployeeListComponent` to display a list of employees. Use interpolation to display employee names and other details. Use property binding to dynamically set CSS classes based on employee properties (e.g., highlight employees with more than 5 years of experience). 3. Employee Detail Component Create a nested component called `EmployeeDetailComponent` to show detailed information about a selected employee. Use `@Input` to pass th
Post a Comment
Read more

Console app: Building a Library Management System in C#

-
Image
Introduction In this blog post, I will guide you through creating a simple Library Management System in C# that utilizes the concepts of encapsulation, polymorphism, and inheritance. This exercise is perfect for practicing object-oriented programming principles. Objective Create a simple Library Management System that demonstrates encapsulation, polymorphism, and inheritance. Requirements 1. Encapsulation    Create a `Book` class with private properties: `Title`, `Author`, `ISBN`, and `IsAvailable`.    Provide public methods to get and set these properties as needed. 2. Inheritance    Create a base class `LibraryItem` with common properties such as `ID`, `Title`, and `IsAvailable`.    The `Book` class should inherit from `LibraryItem`.    Create another derived class `Magazine` that inherits from `LibraryItem` and has additional properties such as `IssueNumber` and `Publisher`. 3. Polymorphism Create a method `DisplayDetails` in the `LibraryItem` class that can be overridden by the der
Post a Comment
Location: Mauritius
Read more

Angular : simple contact list

-
Image
Introduction In this blog post, I will demonstrate how to create a simple contact list application using Angular. This application allows users to add, view, and delete contacts. It is a great project for those looking to get started with Angular and understand the basics of data binding, event handling, and component interaction. Features Add new contacts View the list of contacts Delete contacts Getting Started To get started, ensure you have Angular CLI installed. You can create a new Angular project using the following command: ng new contact-list-app Navigate to your project directory cd contact-list-app Code Snippet Below is a snippet of the main component code for the contact list application. This includes the component decorator and the logic for managing the contacts. import { Component } from '@angular/core'; import {FormsModule} from "@angular/forms"; import {NgForOf} from "@angular/common"; in
Post a Comment
Location: Mauritius
Read more

Angular: building basic calculator

-
Image
Introduction In this tutorial, we will walk through the steps to create a simple calculator application using Angular. This exercise is designed to help you practice your Angular skills and understand the basics of building a user interface and handling events. Prerequisites Before you begin, ensure you have the following: Basic understanding of Angular Angular CLI installed Node.js and npm installed Step 1: Setting Up the Project First, let's create a new Angular project. Open your terminal and run: ng new BasicCalculator  cd BasicCalculator  ng serve This will set up a new Angular project and start the development server. You can view the default application by navigating to http://localhost:4200 in your browser. Step 2: Designing the Calculator UI In app.component.html, design the UI of the calculator. Here's a simple structure to get you started: <div class="container"> <div class="calculator"> <div><input class=&
Post a Comment
Location: Mauritius
Read more

Beginner: Temperature Converter in C#

-
Image
Introduction In this tutorial, we will create a simple console application in C# that converts temperatures between Celsius, Fahrenheit, and Kelvin. This is a great project for beginners to practice basic programming concepts and console input/output operations. Code Implementation: ITemperatureConverter internal interface ITemperatureConverter { TemperatureUnit ReadConvertUnit(string baseUnit); bool IsInputValid(string baseValue, TemperatureUnit baseUnit, TemperatureUnit targetUnit); decimal Process(string baseUnitValue, TemperatureUnit baseUnitEnum, TemperatureUnit targetUnitEnum); } TemperatureDataService Read user input public TemperatureUnit ReadConvertUnit(string inputUnit) { if (!int.TryParse(inputUnit, out var unit)) { Console.WriteLine("Invalid temperature unit. Please enter convert unit: "); inputUnit = Console.ReadLine(); ReadConvertUnit(inputUnit);
Post a Comment
Location: Mauritius
Read more

Building an Angular App: To-Do list

-
Image
Introduction In this post, I'll share my experience building a small Angular application called "To-Do List". This is a practice project to delve deeper into Angular concepts. Application Overview Simple angular application Basic Angular concepts No API calls Pure front-end implementation Code Snippet app.component.html <div class="container-fluid"> <div class="container"> <div class="row align-items-center"> <div class="col-4"> <div class="card"> <div class="card-header"> <label for="exampleFormControlInput1" class="form-label">Add to-do</label> </div> <div class="card-body"> <h5 class="card-title">New Do It</h5> <input type="text" class="form-control" [(ngModel)]="toDoValue" i
Post a Comment
Location: Mauritius
Read more

Palindrome Checker

-
Image
C# Exercise: Palindrome Checker C# Exercise: Palindrome Checker Description Write a C# program that checks if a given string is a palindrome. A palindrome is a word, phrase, number, or other sequence of characters that reads the same forward and backward, ignoring spaces, punctuation, and capitalization. For example, "radar" and "A man a plan a canal Panama" are palindromes. Program.cs Console.WriteLine("Enter a text to check if it is a palindrome"); var text = Console.ReadLine(); var check = new PalindromeChecker.Class.PalindromeChecker(); if (string.IsNullOrEmpty(text)) Console.WriteLine("Text value empty"); if (check.IsPalindrome(text)) Console.WriteLine($"'{text}' is a palindrome"); else Console.Writ
Post a Comment
Location: Mauritius
Read more
-
Image
C# Exercise: Fibonacci Sequence C# Exercise: Fibonacci Sequence Description Write a C# program to generate the Fibonacci sequence up to a specified number of terms. The Fibonacci sequence is a series of numbers where each number is the sum of the two preceding ones, usually starting with 0 and 1. For example, the first few numbers in the Fibonacci sequence are 0, 1, 1, 2, 3, 5, 8, 13, 21, ... Your program should prompt the user to enter the number of terms they want in the Fibonacci sequence and then output the sequence up to that number of terms. Exercise Console.WriteLine("Enter the number of terms for the Fibonacci sequence:"); var numTerms = Convert.ToInt32(Console.ReadLine()); var iteration = 0; var firtNumber = 0; var secondNumber = 1; var nextNumber = 0;
Post a Comment
Location: Mauritius
Read more

Angular : Setup

-
Image
Download Node.js Download Node.js NVM (Node Version Manager) Download and install NVM: GitHub - coreybutler/nvm-windows Command: Install a version of Node: nvm install 14.15.1 Use a version installed: nvm use 14.15.1 List all installed Node versions: nvm list Install Angular CLI npm -g @angular/cli Create Project Create a new Angular project: ng new [AppName] Or with a specified prefix: ng new [AppName] --prefix [PrefixName] All generated components will have the prefix in the selector o
Post a Comment
Read more

Angular : introduction

-
Features of Angular Two-Way Data Binding Data binding is automatic and fast. Changes made in the View are automatically updated in the component class and vice versa. Powerful Routing Support The Angular Powerful routing engine loads the page asynchronously on the same page, enabling us to create Single Page Applications. Expressive HTML Angular enables us to use programming constructs like if conditions, for loops, etc., to render and control HTML pages. Modular by Design Angular follows the modular design. You can create Angular modules to better organize and manage our codebase. Built-in Back End Support Angular has built-in support to communicate with the back-end servers and execute any business logic or retrieve data
Post a Comment
Location: Mauritius
Read more