Posted by Shraddha Parkale

Expense management refers to the systems established by a business to process, pay, and inspect employee-initiated expenses. This system tracks your daily expenses and provides comparative charts to show your expense summary.

Through this post, we will understand the essentials of Expense Management. It will cover what is Expense Management System, its key features, benefits, and later we will cover its implementation using Bootstrap front-end technology.

What is the Expense Management System?

This system acts like a calculator that allows you to analyze and calculate your daily expenses, and for better understanding provides a wide variety of GUI(Graphical User Interface) like graphs, pie charts, bar charts.

Key Features:

1. Mobile-enabled expense report tools help employees track, manage and submit expenses on the go.

2. It can easily integrate DB to eliminate data silos and reduce manual data updates.

3. Dynamic workflows reduce human interference and shorten the turnaround time of the expense management process.

4. Visual graphics-rich reports help to analyze the common business expenses to eliminate overspending and spot improvement opportunities.

5. An Instinctive dashboard that displays visual-rich reports based on priority and business needs will help these reports to informed stakeholders.

Benefits of Expense Management system:

1. Total Expense Visibility provides informationexactly what’s going on in your business at all times.

2. Big-Time Savings on creating reports on the dashboard and it will update every hour automatically.

3. When you see your success/failure key metrics in your dashboard, you intuitively start improving your results. 

4. Reduced Stress due to getting notifications from the dashboard so no need to continuously watch on the system.

5. To Increase Productivity Dashboards allow you to calculate performance and show in charts.

What is bootstrap and its main features:

We have used the newest version of Bootstrap to build up the system, version 4, which is the most popular with HTML, CSS, and JavaScript framework for developing responsive, mobile-first websites. These provide new components, faster stylesheet, and more responsiveness.

Bootstrap Features:

Updated Print Styles and Utility Classes

There is a great improvement in the rendering of pages. It ensures the reasonable size of pages rather than making them fit mobile screens only. 

 Additive Border Utilities

It is providing additive border utilities to quickly add all borders to your components. The default border is set to a solid 1px light gray color.

 New Responsive Classes

 The new responsive classes .order-0 and .order-last are introduced for more control over the flexbox grid.

 Added documentation

The new documentation is added for using the CSS variables. Bootstrap 4 provides 2 dozen of CSS variables as compared to the previous version. 

How to Design an Expense Management system using Bootstrap?

1. First, go to the files menu in the toolbar. From files -> new -> project to create a new project.

2. This will open a new project window as shown below.

3. To Install bootstrap in the current project Right Click on project-> Manage NuGet packages->Bootstrap CSS -> click on the install button.

4. After successfully installing Bootstrap in your project you are able to see folder structure as below.

5. Now you can design your aspx pages using bootstrap in the following way.

As mentioned in the screenshot first use bootstrap.min.js and jquery.min.js in your aspx page.

I have used below given Bootstrap4 features to design web pages:-

• jumbotron class – This jumbotron class indicates a big box for calling extra attention to some special content or information.
• navbar-expand-sm – navbar vertically on small screens.
• .nav nav-tabs – Creates navigation tabs
• .nav-item – Creates tab items
• .nav-link – Styles links inside the navigation tab

You can use static value using the option tag in the following way:-

6. I have made sample pages of ‘Expense management system using bootstrap4’ as follows:-

Home Page:-

About us page:-

Expense Manager Page:-

Calculate Expense Page –

Conclusion:-

In this article, we implemented an Expense management System using Bootstrap. At Neova, we have an expert team of front end developers who can extend their services to build responsiveness mobile and web applications. 

Source Code: Kindly refer below link to get code for the above-discussed project.

Why do we need Unit testing?

● The developer knows where our code “breaks” as compared to the tester, so while developing if we implement Unit testing then we can improve code quality, so this will help in reducing bug-fixing, cost and time.

● If we ignore Unit testing it leads to higher defect fixing cost and time during System Integration and Beta testing after the application is completed. Proper unit testing done at initial stage at developer’s end saves both time and money.

What is Unit testing?

Testing an individual unit, such as a method (function) in a class, from other modules of your application. A Unit test doesn’t test the whole module; it tests the smallest unit that makes up a more significant module

Advantages:

• With Unit testing, the speed of development will be faster.
• Traditional testing involves setting breakpoints, debugging the code and providing inputs through GUI(Graphical User Interface). But Unit testing will simplify testing without GUI.
• It takes less time to find and fix the bugs during Unit testing.
• Reusable codes also reduce the effort and save time as the code needs to be modular in Unit testing and also bugs are fixed in the initial stage.

Disadvantage:

• It cannot catch broad system errors or integration errors.

Different frameworks available in market for Unit testing:

1. MSTest – It is an in-built testing framework provided by Microsoft.

2. NUNIT – It is an open-source testing framework that is entirely written in c#.

3. XUNIT – This framework supports programming language i.e JUnit for java and .net.

Let’s do a quick comparison to evaluate better framework:

NUnit VS MSTest:

• Nunit contains an [TestCase] attribute that allows implementing parameterized tests. This feature is not available in MSTest
• MsTest’s ExpectedException attribute is a bug where the expected message is never really asserted even if it’s wrong – the test will pass.
• NUnit contains an articulate version of Assert API (as already mentioned – Assert.That..)
• Nunit is much faster
• NUnit can run tests in  both versions like 32 and 64 bit (MSTest only runs them in 32 bit IIRC)
• NUnit allows an abstract set of classes to be test fixtures (so you can inherit test fixtures). MsTest does not contain test fixtures.
• NUnit contains PNunit (running parallel tests with NUnit). MsTest only adds this ability in visual studio 2010 IDE

How to integrate NUnit Framework?

NUnit – provided by Microsoft.NET  open-source Unit testing Framework. It provides a rich set of assertions as static methods of the Assert class. NUnit Assert class is used to determine whether a particular test method gives expected results or not. In a test method, we write code to check the business object behavior.

NUnit Features –

• Run test suites parallelly.
• Strong support for data-driven tests.
• Supports multiple platforms including .NET CORE, Compact Framework, and Silverlight.
• Every test case can be added to more than one category, to allow for selective running.
• These Tests can be run from a console runner, within Visual Studio through a Test Adapter, or 3rd party runners.

Attribute difference Test class vs Test fixture

Using the “Test fixture” attribute we can provide parameters for class but using “Test class” will allow parameters for only Test attributes method. 

E.G – [TestFixture(“hello”, “hello”, “goodbye”)]

REST API:-

A RESTful API is used to send HTTP requests like GET, PUT, POST, and DELETE data through existing protocols.

Working Flow of REST Request:-

 After sending a Rest request from the user it will go to API=> App layer=> Controller=> Repository=> Database Services, performs execution and sends a response back to the server.

How to Integrate REST API with Unit testing using NUnit Framework?

Step-1: Download and install Nunit3-console or follow the links given below:-https://github.com/nunit/nunit-console/releases/download/v3.10/NUnit.Console-3.10.0.zip

Step-2: Open the respective Unit testing project in Visual Studio Or Create a new Unit testing project as:

Step-3: Open NuGet Package Manager Console for that project and type following commands in the given order:

• Install-Package NUnit -Version 3.12.0
• Install-Package RestSharp -Version 103.1
• Install-Package NUnit3TestAdapter -Version 3.13.0

       Perform this for each Unit testing project.

Step-4: Performing Nunit we need to declare Test class and Test attribute for function

Step-5: Build and execute the test project

Step-6: There are 2 ways of running Unit test:

1)Through Test Explorer in Visual Studio:

Click on Test tab →  Select Windows tab →  Click on Test Explorer

After this a new pane will open on the left side which will contain all the test cases found by the test explorer. These are the test cases which have attributes [Test] above them in a test fixture in Unit testing projects.

• You can run these test cases selectively or all together.

• You can also debug test cases by right-clicking on them and selecting the Debug option to check the workflow of a particular test case.

The NUnit 3 Test Adapter which we installed earlier, allows you to run NUnit 3 tests inside Visual Studio.

2)Through Command Prompt:

Note: Always Open Command prompt  in administrator mode for running NUnit console command-line test cases

There are 3 ways of Testing:

1. Test by using Default parameters
2. Test by providing parameters 
3. Test by providing invalid parameters

1) Change directory to installation directory of NUnit console

eg: C:\WINDOWS\system32>cd C:\Program Files (x86)\NUnit.org\nunit-console  

2) Sample test case

C:\Program Files (x86)\NUnit.org\nunit-console>nunit3-console.exe 
--testparm:hotelbookingid=AIR
--test:"HotelBooking.DataLayer.Tests.HotelSeriviceTests.GetBookingSystemSettings" 
"E:\PROJECTS\UnitTests\HotelBooking.DataLayer.Tests\bin\Debug\HotelBooking.DataLayer.Tests.dll"

Where,

--test param → parameters to be passed to test case

(If multiple parameters need to be passed following the same syntax for each param with space in between and if no parameters are required then skip this)

--test → namespace of the test case class which contain program filename and test method name

"E:\PROJECTS\UnitTests\HotelBooking.DataLayer.Tests\bin\Debug\HotelBooking.DataLayer.Tests.dll" → DLL path to Unit testing project folder 

If we don’t pass any test parameters, then the tests will run with default parameters given in the code.

Conclusion

 In this article, we explained how to write  Unit tests for Rest API and the purpose was to get an idea about how Unit tests are written and executed and a major advantage of this Unit testing is that we know the actual rest request failed reason.