Exploring Test case (Part 2)

Hello there, I hope all is okay with you. As part of my task last week, I worked on writing a test case for the “Name Display” feature during the login process. Here is a brief summary of what I accomplished. After I already get helped from Peter, Peter show me to write test script well written without any errors.

Next, continue with this week task. For this week, I continue to explore on the test script. About the task, Peter showed me on how to use test timer with beforeEach and afterEach. By using describe function used to group together related test cases with a common name which is “Test Timer”. The beforeEach function is a Jest lifecycle hook that specifies setup step that should be executed before each test case in the test suite. For this case, it is using “jest.useFakeTimers” with the “advanceTimers” option set to true. This will allow Jest to replace the real timers in the environment with fake timers that can be controlled programmatically in the test cases. It also calls “jest.resetModules()” to reset any modules that may have been cached by Jest, ensuring a clean state before each test.

Furthermore, for the first test which is “Display user name if not logged in”. It renders component with props.navigation and props.route as props. It then uses the “getByTestId” function to get the component is equal to the expected string. Second test which is “Display correct user name when logged in”. It renders component with props.navigation and props.route as props using the render function. It then calls jest.advanceTimersByTime to advance the timers. It asserts that the props.children of the retrieve component is equal to the expected string “Welcome, ${displayName} !”.

Exploring Test case (Part 1)

Hey there, I hope you are doing well. It is time for my weekly work update, highlighting the progress I made during past week. As part of my tasks last week, I worked on writing a test case for the “Name Display” feature during the login process. Here is a brief summary of what I do: For the test case task, Peter told me to write a test case to verify that after logging in, going back to the home screen, reopening the app, and pressing login without retyping login credentials, the correct name displayed. There also several test case file for the references.

At first I try to figure out what to write, after I refer to the another test file, it open my eyes on how to write the test script. After I already finished write the test script, then I try to run the test. At first the result for the test is fail, then I try to look back on what that make it is failed. It is cause from the “testID” that make the test script keep failed. I try to figure out on how to solve the error by Google and explore the other file that have the test script. After several tries and it still keep showing the test script is fail and not pass.

ASP.Net Core and RESTful API

Last week, I had the opportunity to learn the architecture of ASP.NET Core 3. The first part of the course I was exposed to the importance of separating concerns in an application by organizing code into layers, including the presentation layer, application layer, domain layer, and infrastructure layer. Additionally, I also explored how to implement clean architecture in ASP.NET Core 3 applications, including how to structure the code and how to use interfaces and dependency injection to decouple components so that the code easier to maintain for future usage.

Going to the next part, I started to delved into Automapper, a powerful tool that can simplify the process of mapping data between different objects in the application. I learned how to install and configure Automapper in ASP.NET Core 3 application, and how to use it to map data between entities and DTOs (data transfer objects). Next, a design pattern known as CQRS (Command Query Responsibility Segregation), which divides the duties of managing read and write operations in an application, was the next area of emphasis for me. At first, I struggled to understand the CQRS concept, but Mr. Peter clarified it for me, helping me to understand the idea of it as a whole. I learned about the benefits of CQRS, including how it improved scalability and performance. I even also explored how to use MediatR, a popular library for implementing CQRS in .NET applications.

After few days going through the architecture of ASP.NET, the next 2 and a half day of the week I started to go through a new topic called “Building a RESTful API with ASP.NET Core 3”. I learned about the difference between the Outer Facing Model and the Entity Model. The Outer Facing Model represents the data that will be exposed to clients through the API, while the Entity Model represents the data that is stored in the database. the course also taught on how to map between these two models, and how to use Automapper to simplify the process.

Another key aspect of building a RESTful API is handling HTTP requests, including POST, PUT, and PATCH requests. I learned the differences between these requests and how to handle them in an API. I also explored how to use data annotations and custom validators to validate user input, which is critical for ensuring the integrity of data. Finally, the course covered how to delete a resource in an API, including how to handle deleting a single and related resources in the database.

Overall, the past week learning is quite complex for me. I did gained the understanding of the whole concept and idea of the materials but in term of practicality and codes, I must say I’m still very weak. However, I really look forward on exploring more on these topics and gaining deeper understanding on implementing the knowledge of the ASP.NET architecture and building the RESTful API.

About the Application

Last week, Peter introduced to me an application that we use in Tong Hin. Briefly describe about the code that used in this application, It is use a React Native component that implements a login view for an app using the OAuth 2.0 authorization framework. It allows users to log in with a provider, in this case, obtains an access token and an ID token that can be used to authenticate the user’s identity and access protected resources on behalf of the user.

It’s imports libraries such as AsyncStorage, react-native-paper, and react-native-app-auth to implement functionalities such as token storage, UI components, and OAuth 2.0 authorization. The AppContext is used to share data between components, and screens in the app.

Next, it’s also defines the configuration for the authorization provider that will be used for the OAuth 2.0 authorization. The provider’s issuer, client ID, redirect URL, and etc are specified, as well as the scopes that the app requires access to.

Finally, defines the default state of the authentication, which includes information such as whether the user has logged in, which provider was used, and the tokens obtained from the authorization process.

EF Core 5

In my second week at Tong Hin, I started up by studying object-oriented programming (OOP) and learnt that OOP is a programming paradigm that is widely used in C#. It is a way of programming that focuses on creating objects that interact with each other to accomplish tasks. In OOP, objects are created from classes, which define their properties and behaviors.

The main concepts of OOP in C# include encapsulation, inheritance, and polymorphism. Encapsulation is the practice of hiding data and methods within an object, so that they cannot be accessed from outside the object. As for Inheritance is a concept that allows classes to inherit properties and methods from other classes where inheritance creates a hierarchy of classes, with each class having a parent class, except for the root class, which has no parent. Inheritance also enables developers to create new classes based on existing classes (parent class). Thus, reducing code duplication and promoting code reuse. The derived class inherits all the properties and methods of the parent class, and can also add new properties and methods.

Later on the same week, I started to go through another module which is Entity Framework (EF), it is an object-relational mapping (ORM) framework for .NET applications that provides a simplified approach to working with databases, and the latest version, Entity Framework Core 5 (EF Core 5), offers several new features and improvements compared to the earlier versions. When I first started learning Entity Framework, I was impressed by its ability to simplify data access by mapping database tables to classes and providing a LINQ-based query syntax. EF made it easy to create, read, update, and delete records in a database without needing to write complex SQL statements. I also learnt that EF Core is cross-platform support where it can run on multiple operating systems, including Linux and macOS. This makes it easier to develop and deploy applications on a wider range of platforms. 

Another significant feature in EF Core 5 is its support for multiple databases. While EF only supports Microsoft SQL Server, EF Core 5 supports a variety of databases, including PostgreSQL, MySQL, SQLite, and more. As a result, working with various data sources is made simpler without the need to learn additional frameworks or languages.

Overall, EF Core 5 is a valuable tool for developers who need to work with data in .NET applications. It simplifies the process of data access and provides a range of features to enhance performance and improve developer productivity.

Glimpse on React

On the second week of my internship, I begin to dwell deeper into the concept like core components and native components. React Native has many Core Components for everything from controls to activity indicators. The examples of React Native Core Components is <View>, <Text>, <Image>, and <ScrollView>.

React Native runs on React, a popular open source library for building user interfaces with JavaScript. The core concepts behind react is components, JSX, props, and state. We can think of components as blueprints. Whatever a function component returns is rendered as a React Element. Next is JSX, a syntax that lets you write elements inside JavaScript. Props is a short for “properties”. Props lets you customize React Components. Lastly, state. State is like a component’s personal data storage. State is useful for handling data that changes over time.

My First Week at Tong Hin

In my very first week at Tong Hin Company, I was thrilled to finally join the team, and my eagerness to gain knowledge was at its peak. On the first day, I was given a task by Mr Peter to learn and understand Git, which is a powerful, sophisticated system for distributed version control. Gaining an understanding of its features opens to developers a new and liberating approach to source code management.

The second day, my next task here was to learn C#. I had some prior knowledge of programming languages. However, I had never learnt the C# language and I thought C# was a really interesting one. C# is a popular programming language developed by Microsoft, and it’s widely used for developing software apps and games for Windows and many more. Although my previous experience with other programming languages made it easy for me to understand the fundamentals, getting a hang of C# still took a lot of effort.

I spent hours at the online course sessions, understanding the logic behind syntaxes and understanding the structures of C# and I learnt that C# is an object-oriented programming language, and as such, its programming model is based on classes and objects. I also learnt about how to create classes, objects, and methods, and how to use them to achieve their programming goals. As a developers, you can’t just understand C# in theory, so I also spent time experimenting through the language in the Microsoft Visual Studio. However, there’s still much more that needs to be learnt and practiced so that I can master the understanding. The first few days were challenging, but I didn’t let the difficulties of learning discourage me. 

In conclusion, my first week at TongHin was a fascinating and educational experience. I was able to learn the basics of C# programming language. Though there’s still a lot more to learn, I’m excited to learn more and improve my understanding of how to build software applications efficiently and also to expand my skill set continually.

First Week of Internship at Tong Hin

For the first week at Tong Hin, I spent my first week at the company mostly concentrating on understanding the technology that would be used the following week. I started out by learning how to utilise git. I learned how to create repositories, commit changes, merge repositories, and push any changes made in the repositories using the git command.

Next, Peter also provides me with some courses that would get me more prepared before the real work as Front-end. Peter’s provide me of how to use Microsoft Visual Studio Code IDE, TypeScript, React Fundamentals, React Hooks, and React Native Fundamentals. There are also exercises files available for me to download and experiment it during free time.

Lastly, I would like to thanks to Peter for guiding me through this first week of internship at Tong Hin.

Last Week at Tong Hin

For this week, I was able to implement the logic of regenerating original quantities of previous ItemHistory that were currently not computed and stored 0 as an original quantity.

Started off by using DbContext in ViewModel to get all list of histories then proceeded to use a foreach loop, where each row of history was subjected to a function that computed its original quantities, eventually saved the updated history to database using SaveAsync().

Once the logic was coded, it was time to test it. Added a test-case for previous histories original values calculation, as it was 0 previously. Faced issue with DateTime, as I was using DateTime.now(), so using OrderBy() didn’t actually ordered the rows. As this feature is considered a service of ItemHistory, it became clear that there needed to be a separate file to test it, so a HistoryServiceTest was formed.

Next, Mr.Peter decided to put the code to the test, and we discovered a bug in the algorithm that caused a source history to go unnoticed. Mr.Peter made me fix the code and showed me a better way to test. Moreover, another bug was discovered that allowed previous non-computed rows of history to take their value in current history, so the condition was changed to skip non-computed rows. Once all bugs were fixed the logic looked promising.

Finally, began Code review with Mr.Peter. Discussed on one more condition to use item status while calculating original values of ItemHistory. Added Status to History and added a test-case to check if the correct StatusId was being assigned on creation of ItemHistory.

This marked the end of my 3-month internship with Tong Hin.

Previous Histories Original Quantities Calculations

For this week, I was able to implement the logic of calculating the original quantities for history and proceeded to implement logic for previous histories quantities calculation.

Started off by running an SQL script to include additional columns. Updated the overridden AddAsync method to populate the additional fields in a history according to business rule. Made use of edge cases to test the logic in the repository, some bugs were discovered that prevented the detection of previous locations for both the source and the destination, and fixed it.

Moreover, I was struggling to understand how to test the repository’s create logic because I was currently using the UI to test the logic, which is not a good method. Mr. Peter was able to clarify this for me. Created HistoryRespositoryTests and added testcases to test the repository logic through various conditions and edge cases. Furthermore, discussed the importance of populating existing history data quantities.

Lastly, I realized I had hardcoded the disable property in barcode, so I converted it to a boolean property and binded it to the IsEnabled property. Moved onto a new task to populate previous history quantities. Added a button to the UI which on interaction will retrieve all histories and populate their original quantities. I was able to successfully retrieve all histories from the database and display them in the UI.