The Art of Crafting Web Systems: Unveiling the Front End, Back End, and Data Persistence Layer

In the exciting realm of web development, the successful implementation of web systems hinges on understanding the intricate dance between three core components: the front end, the back end, and the data persistence layer. This blog post aims to dissect these vital components, shedding light on how they collaborate harmoniously to bring web applications to life.

The Front-End Canvas

Imagine the front end as the artist’s canvas, the visual facade of your web application that users interact with directly. It encompasses everything you see and interact with on a website—buttons, forms, navigation menus, and the overall layout. The front end relies on a trio of essential technologies:

  1. HTML (Hypertext Markup Language): HTML acts as the foundation, structuring web pages by defining content and layout.
  2. CSS (Cascading Style Sheets): CSS is the stylistic wizard responsible for the visual appeal, ensuring that the web elements harmonize seamlessly.
  3. JavaScript: JavaScript adds interactivity to the canvas, bringing it to life by creating dynamic elements, managing user input, and facilitating communication with the back end.

The Back-End Engine

Behind the scenes, the back end serves as the powerhouse of your web application. It handles user requests, processes data, interacts with databases, and sends responses. Several technologies and frameworks excel in back-end development:

  1. Node.js: Node.js enables JavaScript to run on the server side, making full-stack development a breeze.
  2. Ruby on Rails: Rails offers a structured framework that simplifies the creation of robust web applications with concise code.

The Data Persistence Layer

No web system is complete without a reliable data persistence layer. This layer manages data storage, retrieval, and efficient data management. It’s home to various types of databases, including:

  1. MySQL: MySQL, a popular relational database, is known for its reliability and is widely used in web applications.

The Synchronized Symphony

These three layers—front end, back end, and data persistence—complement each other to deliver a seamless user experience. When a user interacts with the front end, JavaScript often sends HTTP requests to the back end. The back end processes these requests, interacts with the chosen database to retrieve or store data, and then sends a response back to the front end. JavaScript on the front end dynamically updates the user interface based on this response, creating a responsive and interactive web application.

In Closing

Understanding the synergy between the front end, back end, and data persistence layer is fundamental to web development. These layers work in harmony, much like the instruments in an orchestra, to create the symphony of a fully functional web system. As you embark on your web development journey, remember that mastery of these layers takes time, practice, and a touch of artistry. So, keep coding, keep building, and explore the boundless possibilities of web system implementation.

References:

From the blog CS-343 – Hieu Tran Blog by Trung Hiếu and used with permission of the author. All other rights reserved by the author.

Navigating the Aroma of Code: Unveiling Code Smells and Design Smells

In the vast landscape of software development, there’s an underlying principle that seasoned developers know all too well: code should not only work but should also be maintainable, readable, and scalable. To achieve this, we often find ourselves identifying and addressing something known as “code smells” and their close cousins, “design smells.”

Understanding the Essence

Let’s start with the basics. Code smells are those subtle hints in your codebase that something might be off. They’re like those faint odors in your room that you can’t quite pinpoint but know need attention. These “smells” indicate potential issues that can make your code harder to understand, modify, and extend (Fowler, 1999).

On the other hand, design smells are more like the underlying structural issues in your code that lead to code smells. If code smells are the symptoms, design smells are the root causes (Beck et al., 2002). Identifying and addressing design smells is essential for maintaining a clean and healthy codebase.

Common Code Smells

  1. Long Methods: Code smells often start with overly long methods or functions. When a function becomes a novel, it’s difficult to follow, debug, or modify. Break down long methods into smaller, focused ones for clarity (Fowler, 1999).
  2. Duplicate Code: Repeating the same code in multiple places is a classic smell. It leads to maintenance nightmares since you have to make changes in multiple locations when updates are needed (Fowler, 1999).
  3. Large Classes: Just as long methods can be problematic, large classes or modules can become unwieldy. Split them into smaller, more cohesive units (Fowler, 1999).
  4. Magic Numbers: Using hard-coded numbers without context is a recipe for confusion. Replace them with named constants or variables (Fowler, 1999).

The Path to Design Smells

Design smells often stem from issues in the overall architecture and structure of your code. Some common design smells include:

  1. God Class: When one class knows too much and does too much, it becomes a “God Class.” This violates the Single Responsibility Principle (SRP) and makes the code less modular (Fowler, 1999).
  2. Spaghetti Code: Unstructured and tangled code that’s hard to follow is like a bowl of spaghetti. It usually arises from poor planning and lack of separation of concerns (Kerievsky, 2014).
  3. Circular Dependencies: When modules or classes depend on each other in a circular manner, it can lead to maintenance challenges and hinder code reusability (Fowler, 1999).

The Importance of Addressing Smells

Ignoring code and design smells is like letting that mysterious odor in your room linger; it won’t get better on its own. Instead, it can worsen over time and create a bigger mess to clean up (Fowler, 1999).

Addressing code smells and design smells early in the development process can save time, reduce bugs, and make your codebase more maintainable. It’s like opening the window to let fresh air in; your code will become more pleasant to work with (Fowler, 1999).

Conclusion

In the world of software development, understanding and recognizing code smells and design smells is essential for writing clean, maintainable, and efficient code (Fowler, 1999). Just as identifying that peculiar odor in your room can lead to a more comfortable living space, addressing these smells in your code can lead to a more productive and enjoyable development experience.

So, as you embark on your coding journey, keep your nose keen, and don’t hesitate to refactor and improve your code whenever you detect those telltale aromas of code and design smells. Your future self—and your fellow developers—will thank you.

References:

  1. Fowler, M. (1999). Refactoring: Improving the Design of Existing Code.
  2. Beck, K., et al. (2002). Extreme Programming Explained: Embrace Change.
  3. Kerievsky, J. (2014). Refactoring to Patterns.

From the blog CS-343 – Hieu Tran Blog by Trung Hiếu and used with permission of the author. All other rights reserved by the author.

Week of October 2, 2023

https://refactoring.guru/design-patterns/singleton

This week, I wanted to a find a source relating to software design and architectures. I’ve been curious about what I would need to know so I could write more robust and efficient code. One aspect of improving my code would be knowing how best to preserve available system memory and perform whatever tasks I need to within as few CPU cycles as I can. If my program is creating multiple instances of a class that are all doing the same thing, my code would be consuming more system resources than if I had one instance of a class that could be accessed by other parts of my code. The Singleton design pattern seeks to preserve memory consumption by utilizing a single static instance of a class that may be globally referenced from the rest of the program. To properly implement the Singleton, the constructor for your Singleton instance should be static and private. To get the instance, you would also need a public static creation method.

My homework for this week involves refactoring a class into the Singleton pattern, so I was especially interested in learning about it. I found this blog called The Refactoring Guru, and a post explaining the implementation of the Singleton, as well as the pros and cons from a design perspective. The Singleton design is useful when a program needs global access to a class, like when a program has a single attached database. The drawbacks of the Singleton approach, though, are that it does too many things at once in violation of the Single Responsibility Principle, and that it may compromise your program’s security because of a crucial class being accessed as a global variable.

The final paragraph of the blog post makes some comparisons between the Singleton design and two other software design patterns, Façade and Flyweight. Façade is a design pattern of constructing a simple user interface with a complicated backend. This design pattern offers a sort of “black box” functionality to users, having a simple frontend to interact with without the need to inform users about the inner implementations of the software. The practical example given for a Façade software design is a video encoding service that accepts video files from the user as input and returns the same file encoded in a new file format. The user would only need to interact with the function that accepts a file and a desired file type as parameters, without needing to access the methods within the program that perform operations on the input file.

This blog includes helpful illustrations and pseudocode to explain multiple different software design patterns. I’ve been needing more resources on broader software structure and design rather than individual blocks of code, and I’m happy that I found this website.

From the blog CS@Worcester – Michael's Programming Blog by mikesprogrammingblog and used with permission of the author. All other rights reserved by the author.

Reflecting on “Microservices” by Martin Fowler Week-4

In our exploration of contemporary software design within this course, the significance of architectural paradigms cannot be overstated. The world of software development is abuzz with the term “Microservice Architecture,” and to gain a deeper understanding, I recently turned to an article by the renowned Martin Fowler, which offers a profound dive into the subject.

In his piece, aptly titled “Microservices”, Fowler collaborates with James Lewis to dissect the anatomy of Microservice Architecture (MSA). The duo emphasizes the importance of designing software as suites of small services, each running its unique process and communicating through lightweight mechanisms, often an HTTP resource API. They explore the chief advantages of MSA, such as the independence of services, decentralized governance, and resilience. However, they also bring to the fore potential challenges, notably the complexity of managing services and the intricacies of distributed systems.

Martin Fowler’s reputation in the software architecture domain is unparalleled. When seeking a comprehensive yet nuanced perspective on MSA, this article stood out not only due to its depth but also the balanced approach it adopts, discussing both the allure and the cautionary aspects of microservices.

Fowler’s exposition deeply resonated with my understanding and queries regarding microservices. The elegance with which services can be scaled, replaced, or upgraded without disturbing the entirety of the system is truly appealing. Yet, the complexities of inter-service communication and potential pitfalls in data consistency were eye-opening revelations.

The notion that there’s no “one-size-fits-all” in architectural decisions, highlighted in the article, was a significant takeaway. It emphasized the importance of context, understanding the problem at hand, and evaluating if MSA truly aligns with the project’s goals.

This article has enriched my perspective on Microservice Architecture. As I venture into more extensive projects, both in this course and beyond, the insights from Fowler’s exploration will undoubtedly be a guiding light, helping me navigate the complexities of software design.

Tags:

  • CS@Worcester
  • CS-343
  • Week-4

From the blog CS@Worcester – Kadriu's Blog by Arber Kadriu and used with permission of the author. All other rights reserved by the author.

Cs-348, Cs @ Worcester Week 4

Software Development Methodologies

This week we have learned about software development methodology which is a series of processes used in projects. It is a codified communication tool which is a series of workflows between a group of people about how they are going to work, pass information, and communicate between each member in certain ways.

There are two methodologies that were introduced in our class. Waterfall software development methodology is one where each step is performed in order, a single time, and each step is not started until the previous step is completed. Agile methodology, one of the features of this software development methodology is that the cycle of steps is performed repeatedly, in short increments.

I found a blog that points out the common methodologies and they conclude with a comparison between them and also give out suggestions that might suit certain projects.

URL link: https://intersog.com/blog/top-software-development-methodologies/

  1. Waterfall
    This is the most straightforward approach to software development; however, it is relatively rigid as it consists of sequential phases that follow one another in order. All of these stages are performed in sequential order, the next step is started after the previous one is over.
    This method is essential to have clear objectives and stable project requirements. The main disadvantage is rather rigid and does not allow for any flexibility. Once the development stage is over, it is hard to come back to it and implement any changes. Another issue with this method is that it takes a long time.
  2. Agile
    Agile is an alternative development methodology that offers an entirely different experience from the Waterfall model. The idea is to break the development process down into bite-size pieces, increments, allowing the developers to make fast gradual changes to create a perfect end product.
    The agile method has the advantage of enabling developers to make incremental progress over a limited number of iterations. If any adjustments are required, they may always go back to a prior milestone. This method is appropriate for tasks when the final product’s appearance is uncertain. This approach, however, places an undue emphasis on team communication that may be difficult for remote teams to manage. Additionally, the project manager must have extensive experience in managing the entire project.
  3. Rapid Development
    The purpose of this method is to repeat the user design and construction phase as often as needed to satisfy the client’s requirements. This method could produce great results faster and at a lower cost. Being a popular alternative to agile in software development, it allows the developers to adjust to the changing requirements to meet the needs of a changing market.
    So, as much as agile, this approach suits dynamic projects in volatile markets and allows for rapid changes at a low cost. However, RAD method needs to ensure the developers’ expertise.
  4. Lean

This method cuts all the redundancies and inefficiencies to maximize performance. Maximizing the output of the project and the individual contributors. Professional software development teams already use a Lean approach, it is most effective when combined with another method, any project can be made Lean by reducing waste and emphasizing top-priority tasks. It needs a team of developers who can suit their approach to customer demands.

  1. Feature-Driven Development
    The large projects requiring months and months of backend coding, implementing the Feature-Driven Development (FDD) model might work for these projects. Usually, each feature takes a couple of weeks to finish its steps, and by the end of the development cycle, you get yourself a fully functional end product.
    This model is suitable for large projects, and remote teams as it requires fewer client and vendor meetings. The model requires a strong understanding of the project’s scope from every individual developer – all of them need to know what they are working towards.

To sum up, we must choose the one that suits your project. However, they prefer Agile as the most used approach that fits most projects and allows for greater flexibility, especially regarding long-term development cycles. This blog helped me to understand the process of each methodology and know the way to find a suitable method for the project in the future.

From the blog CS@Worcester – Hong Huynh-CS348-WSU by hhuynh3 and used with permission of the author. All other rights reserved by the author.

What is Git?

For the entirety of this course so far we have been working and getting familiar with the version control tool git. In this week’s blog I will be writing about a blog called “What is Git | Explore a Distributed Version Control Tool” by Reshma Ahmed. I have chosen this article in particular to see how it came to existence, the roles they play in companies, and to get a further understanding in addition to what we have learned in class.

From the article I have learned the different types of version control such as centralized version control system and distributed version control systems. Git was created in 2005 by Linus Torvalds designed to “handle small to large projects with efficiency”. Git is a distributive version control system which is a system that prevents corruption and crashes that were caused from having a server hosted in a single repository such as in centralized version control systems due to everyone having a copy on their machine of their local repository. When reflecting back to the course we have been practicing with pushing and pulling from repositories, branches, as well as removing and adding commits. The GitKit activities worked on in class shown us practical issues that one may face with git such as merging issues as well as issues involving different versions of commits.

The article describes some of the features of git which we have looked at in class such as being open source as well as being secure. Open source software encourages transparency, collaboration, and accessibility similar to the FOSS communities mentioned in the first GitKit activity done in class. The article reads “Git uses the SHA1 to name and identify objects within its repository”. This concept becomes apparent from seeing in the GitKit activities done in class when applying commands such as “git log” that shows a commits’ hash as well as the date a commit was made.

Git not only is used in the software development community but plays a detrimental role in companies with more and more companies using git as their go-to version control system. Some of these companies include tech giants such as “Facebook, Yahoo, Twitter, eBay, Salesforce, [and] Microsoft” which shows the significance of git.

When reflecting for my personal future use of git, practical applications of git in the field of machine learning and data science is using git to manage datasets to ensure reproducibility as well as data integrity. In addition, I plan on using git for my data mining course project when collaborating with other peers.

Links

https://www.edureka.co/blog/what-is-git/#companies_using_git

From the blog CS@Worcester – Anthony Duong CS Blog by anthony duong and used with permission of the author. All other rights reserved by the author.

osu!lazer

Osu! is a free rhythm game that I often play and keep up with. Developed by Dean “peppy” Herbert, it was released in 2007 and was heavily inspired by a 2005 Japanese rhythm game known as Osu! Tatakae! Ouendan. The game, even to today, is not very popular compared to what is considered the “mainstream” for video games; but the players and fans of it are truly dedicated and supporting. Since its release, peppy sought to improve, fix, and maintain the game but that became increasingly difficult with how old and jumbled the code for the game was; and thus, he decided to work from the ground up. In 2015, he began the development of an osu! 2.0 which soon became known as “osu!lazer.” 

I chose to cover this game because the development is public, its updates are being covered on their youtube channel, and I enjoy the game and its community. While watching this video (a bunch of lazer updates), I noticed that a well known player known as -GN made a pull request. It was at this point in which I realized that they’ve been working on GitHub and that what they do is basically what I’ve been learning but in a real-world application. 

I thought that now that I was a little more familiar with GitHub and the process of development, I could check out what was happening with osu!lazer. I went to their repository page (https://github.com/ppy/osu/releases) and simply looked around. The most notable things about the repo would be the number of issues and pull requests. 1,000 active issues is already quite the number but over 25,000 issues over the course of this project seems simply insane. This may just be due to my lack of knowledge and experience as this is a relatively small team and project but those numbers could be even bigger with much larger games and their possibly massive development teams. 

Exploring the repo made me realize how complicated software development, game development, or any other kind of development can be, at least with my current knowledge and experience. For example, there are lots of tags used for issues and pull requests, areas of the game, priority, and size are just some of the categories that the team has decided to divide the development into. I realized that how the game is developed, in the coding, more technical, and specific aspects is still quite foreign to me. Despite having taken computer science classes for many years and creating code in those classes, this level of programming seems so far away. I hope to be able to get to this level and possibly even contribute to osu!lazer, but I occasionally find myself questioning if I’ll really be able to code at this level. 

From the blog CS@Worcester – Kyler's Blog by kylerlai and used with permission of the author. All other rights reserved by the author.

Week 3

In week 3, we talked about staying synchronized with the upstream by using pull requests that are merged into the main branch by the maintainer. Synchronizing with the upstream ensures that your local and origin copies of the main branch have the same commits as the upstream main branch. One key thing I took from this week is when pull requests are merged into the upstream main, the main branches in the local and origin repos will get out of synch with the upstream. To start pulling from the upstream, the git remote -v command is first used to connect your local repository to the remote server. It lists the names and URLs of all the remote repositories that the local repo knows about. One other important git command used when synchronizing is git pull. To pull changes from the upstream, the main branch needs to be the active branch in the local repo. After this, git pull upstream main will pull and add commits from the main branch of the upstream repo to the main branch. After merging with the upstream, there’s no need to keep the feature branch and can therefore be deleted. Usually, developers will delete them to avoid having their repos becoming cluttered with old feature branches.

The blog for this week that I chose speaks about how to synch with the upstream and some of the git commands used. To start, you need to have an origin and upstream repo that are active. The command git remote -v helps verify that you have already setup a remote for the upstream repository. When you want to share some work with the upstream maintainers you branch off main and create a feature branch. When you’re done, you can push it to your remote repository and delete the feature branch after. Another important command is git status because it shows you how many commits you have of the synched remote branch. I chose this blog because it further broadens my knowledge on the git commands that are normally used with synchronizing with the upstream. I think it’s important to do research on the material your covering in class in order to improve on the knowledge you already have. This blog has a lot of the commands I used in the git homework 3 and it helped me be more familiar with the git commands. I really liked reading this blog and seeing how some of the things am studying in class are commonly used by developers in their day-to-day jobs.

Reference.

https://www.atlassian.com/git/tutorials/git-forks-and-upstreams

From the blog CS@Worcester – Site Title by lynnnsubuga and used with permission of the author. All other rights reserved by the author.

Don’t Repeat Yourself!

When it comes to writing code, the one thing you want to keep an eye on is that you’re not using the same line of code you used on multiple projects. The don’t repeat yourself principle also known as the DRY principle aims to solve problems is knowledge of duplication. This idea is applied through all levels and phases of software development, most of the time it’s used while making classes. When making classes you end up implementing the same logic in multiple parts of the code. A solution is to remove the common functionality and only implement the parts that are different.

Another example of repeating yourself happens while you’re storing data. You start to create unnecessary attributes in your table, usually, you can derive those attributes from other attributes since they’re mutually dependent on each other. The problem with duplication is that things can change and once you make one change you have to change all of its representations. Making changes requires analysis, In other words not making any proper changes will lead to opposite representations of the same knowledge. These duplicates can happen in multiple ways someone could make a mistake while making the design, and a strict deadline can make people feel rushed to meet that deadline.

DRY is a principle and there are three methods to implement that principle. First is abstractions which are commonly used when making classes, when multiple classes are shared and come with common logic you simply want to abstract the logic into a superclass that each class inherits. The standard object-oriented program has a lot of practices that encourage the DRY principle for writing reusable, readable, and maintainable code. Second automation is a project case for developers. It’s to make sure that developers are communicating with each other so they don’t repeat finished work and talk about any problems they’re having. Last is normalization, this case is for designing databases. Repetition is common in a lot of data representation but creates redundant data, which is hard to maintain. You would want to extract the cases into a separate entity then the source references that entity. The goal is to ensure that the data is consistent and distributed correctly. Data normalization removes repetition in data, making the database more flexible. 

The reason why I picked this topic is because I tend to repeat myself a lot thinking that it wouldn’t be too much of a problem for me to end up having problems with my code and making my code a little more confusing. By using this principle and using the three methods it helps me make sure that my code is readable, reusable, and easy to maintain. I feel like this principle is important to use for everybody who is making a code by themselves or as a group.

Sources: https://www.plutora.com/blog/understanding-the-dry-dont-repeat-yourself-principle

From the blog CS@Worcester – Kaylene Noel's Blog by Kaylene Noel and used with permission of the author. All other rights reserved by the author.

CS@Worcester – Zack's CS Blog 2023-10-04 12:20:04

Week 4: Understanding Software Licenses

This week I will be writing about software licensing and why I chose this topic. I chose to write about software licensing because I personally do not have much prior knowledge about the topic, so I thought that this would be an interesting (and useful) topic to learn about.

To start off, what is a software license? A software license is a legally binding contract between the software creators and the people who are using the software. The license specifies the conditions of using the software including how the user can use, modify, and distribute the technology and its source code.

Upon initial software usage, the end user usually signs an end-user licensing agreement, or EULA, to contractually agree to the terms stated by the license. Abiding by the EULA is important for both the end user and the developer.

Benefits for the developer:

Benefits for the user:

  • Protects the developer’s rights
  • Allows full control of the usage of the software
  • Prevents users from performing undesired actions that may infringe on the terms of the license
  • Clarifies how the software provider uses your private information
  • Prevents the user from paying for unnecessary tools
  • Keeps the user up-to-date on how the technology can be used

Different Types of Software Licenses (5)

  • Public Domain – Allows anyone to use, modify, and distribute the software. The developers are essentially surrendering all rights they would have under copyright laws.
  • Copyleft (Restrictive) – A type of open-source license stating that any future versions of the software must be open-source, or following the same copyright stipulations, like the source code.
  • GNU Lesser General Public License (LGPL) – A weaker type of Copyleft where the user can modify the software, implement it into their own unique software, and license their software how they see fit.
  • Permissive – Another type of open-source license, minimal amount of restrictions on what users can do with the software. However developers can protect their intellectual property by specifying some restrictions.
  • Propriety – The most strict type for users, and the most protective towards developers. Users are not allowed to modify, copy, or distribute the software. Most used for commercial software.

The resource used was chosen because it was relatively short, yet concise by clearly explaining the basics to understanding software licensing. After reading this blog, I learned a lot as I did not know much about the major types of software licenses and that there are specific licenses that fall under each major type. Therefore the article had a positive impact on me. Because my career goal is to become a software developer, understanding what and how software licenses work will be crucial throughout my entire developer journey. I expect to apply the concepts learned in not only my professional career, but also in my personal life as an end user.

Resources:

Galano, Fernando. “Understanding Software Licensing.” BairesDev Blog: Insights on Software Development & Tech Talent, 22 Mar. 2022, http://www.bairesdev.com/blog/understanding-software-licensing/. 

From the blog CS@Worcester – Zack's CS Blog by ztram1 and used with permission of the author. All other rights reserved by the author.