Unit 1: Programming

INTERNATIONAL SCHOOL OF
MANAGEMENT AND TECHNOLOGY

FACULTY OF COMPUTING

ASSIGNMENT COVER SHEET

This form is to be completed by students submitting assignments of level 4 and level 5.

Students are required to complete all sections and attach to your assignment.

STUDENT DETAILS

STUDENT NAME

STUDENT ID

UNIT AND ASSIGNMENT DETAILS

UNIT TITLE Unit 1: Programming

UNIT NUMBER H/618/7388

ASSIGNMENT
Introduction to Algorithms and Programming with an IDE
TITLE

I
Unit 1: Programming

ISSUE DATE DUE DATE

ASSESSOR
NAME

ESTIMATED 5200
WORD LENGTH

SUBMISSION

HAND IN DATE

DECLERATION AND ACKNOWLEDGEMENT

When submitting assignments, each student must sign a declaration confirming

that the work is their own.

Plagiarism and Collusion

Plagiarism: to use or pass off as one’s own, the writings or ideas of another
without acknowledging or crediting the source from which the ideas are taken.

Collusion: submitting an assignment, project or report completed by another

person and passing it off as one’s.

In accordance with the Academic Integrity and Plagiarism Policy:

II
Unit 1: Programming

1. I declare that:
a) this assignment is entirely my own work, except where I have included fully-
documented references to the work of others,
b) the material contained in this assignment has not previously been submitted
for any other subject at the University or any other educational institution,
except as otherwise permitted,
c) no part of this assignment or product has been submitted by me in another
(previous or current) assessment, except where appropriately referenced, and
with prior permission from the Lecturer / Tutor / Unit Coordinator for this unit.

2. I acknowledge that:
a) if required to do so, I will provide an electronic copy of this assignment to the
assessor;
b) the assessor of this assignment may, for the purpose of assessing this
assignment:
I. reproduce this assignment and provide a copy to another member of
academic staff;
II. communicate a copy of this assignment to a plagiarism checking
service such as Plagiarism Check (which may then retain a copy of this
assignment on its database for the purpose of future plagiarism
checking).

I am aware of and understand that any breaches to the Academic Code of Conduct
will be investigated and sanctioned in accordance with the College Policy.

SIGNATURE DATE 8/6/2023

III
Unit 1: Programming

Table of Contents
Presentation on Programming Paradigms........................................................................................1

Procedural Programming paradigm.............................................................................................1

Object-Oriented Programming Paradigm....................................................................................2

Event-Driven Programming Paradigm........................................................................................2

Programming Paradigms Comparision........................................................................................3

An application using programming paradigms............................................................................3

Programming Paradigms implementation on the application......................................................4

Overview of the code structure....................................................................................................5

Build an App using programming paradigms..................................................................................6

Introduction..................................................................................................................................6

What is an Algorithm?.................................................................................................................6

What is Flowchart?......................................................................................................................7

What is Coding Paradigm?..........................................................................................................8

Procedural paradigm................................................................................................................9

Object Oriented........................................................................................................................9

Event Driven paradigm............................................................................................................9

Overview of the application.......................................................................................................10

Analyzing the requirement........................................................................................................10

IV
Unit 1: Programming

Procedure for the application.....................................................................................................11

Detailed steps for the program and Design of the Algorithm....................................................11

Conclusion.............................................................................................................................12

What is Coding Standard?.........................................................................................................12

Why Coding is important?.....................................................................................................13

Coding Standard used in the application...............................................................................14

Implementing the proposed algorithm in the Best Fitness Calculator App...............................15

Challenges faced while implementing the algorithm into code.................................................17

Final project...............................................................................................................................18

Debugging Javascript with IDE.................................................................................................18

Detailed procedure versus code for debugging in order to construct a more robust and secure
application......................................................................................................................................19

Debugger extensions..................................................................................................................20

Debug and run view...................................................................................................................21

Actions Debugging....................................................................................................................22

Run mode...................................................................................................................................23

Breakpoints................................................................................................................................24

Logpoints...................................................................................................................................25

Inspection of Data......................................................................................................................26

(Read-Eval-Print Loop) REPL Debug Console.........................................................................29

V
Unit 1: Programming

Assessment report on generally speaking application with the interaction in question, calculation
plan and execution, and the coding principles...............................................................................30

Implementation of Algorithm....................................................................................................30

The relationship between the written algorithm and the actual source code.............................31

The selection of an appropriate IDE (Integrated Development Environment) for development

...................................................................................................................................................31

Coding standards roles and purposes.........................................................................................32

References......................................................................................................................................32

VI
Unit 1: Programming

Presentation on Programming Paradigms

Procedural Programming paradigm

1
Unit 1: Programming

Object-Oriented Programming Paradigm

Event-Driven Programming Paradigm

2
Unit 1: Programming

Programming Paradigms Comparision

An application using programming paradigms

3
Unit 1: Programming

Programming Paradigms implementation on the application

4
Unit 1: Programming

Overview of the code structure

5
Unit 1: Programming

Build an App using programming paradigms

Introduction

We will be building a calculator app for Best Fitness company which is specialized in providing
fitness training sessions to people from the local community. Here are the requirements for the
calculator (Cocca, 2022).

- The program will have multiple training plans i.e. beginner, intermediate, elite, etc.
- The program will calculate the cost of monthly training fees for their clients.
- The program will allow a user to enter the following information:
o Customer name
o Training plan
o Current weight (kg)
o Target weight
o Sauna options (extra cost)
o Option to add the number of hours of private coaching
- The program should output the following information:
o Customer name
o An itemized list of all costs for the month
o The total cost of training for the month
o Weight Comparison

We will be using all the useful algorithms and coding paradigms for the solution of the software.

6
Unit 1: Programming

What is an Algorithm?

A set of exact instructions known as an algorithm is used to carry out specified operations in a
predetermined order in routines that are based on hardware or software. It is used to complete
calculations or solve problems that frequently call for repeating an operation in a small number
of steps. AI, information science, and PC programming are just a few of the IT subjects that
heavily rely on computations (Upadhyay, 2023).

Here are some essential attributes of algorithms:

Well-defined instructions, finite termination, input and output, deterministic behavior, and
correctness are all characteristics of an algorithm. To accurately complete a task or solve a
problem, it should provide a clear set of steps. A modular structure for code reuse and
maintainability is crucial, as is efficiency in terms of time and space usage. Versatility guarantees
the calculation's exhibition stays consistent with bigger contributions, while consensus considers
more extensive materialness across different cases inside a characterized issue space (Upadhyay,
2023).

Depending on the goal, algorithms might be straightforward or complicated. Natural languages,

computer languages, pseudocode, flowcharts, and control tables can all be used to represent
them. Algorithms can be used to organize lists of numbers or to suggest user material on social
media (Upadhyay, 2023).

What is Flowchart?

A type of diagram called a flowchart is used to show a computer program, process, or system
graphically. Complex cycles are examined, arranged, improved, and conveyed utilizing
straightforward, justifiable illustrations. The many cycles and choice focuses in any cycle are
addressed in flowcharts utilizing normalized images and ideas (asana, 2023).

Here are some essential characteristics of a flowchart:

7
Unit 1: Programming

Symbols: Flowcharts utilize different images to portray the many stages in a cycle, including
square shapes, ovals, jewels, and other mathematical structures. A coordinated flowchart might
be made utilizing more than 30 predefined images (asana, 2023).

Process: A flowchart is a graph that shows a cycle's singular stages in a specific request. It could
be utilized in various cycles, including project plans, managerial or administration systems,
modern cycles, and then some (asana, 2023).

Types: Interaction, framework, and item flowcharts are only a couple of the different kinds of
flowcharts that exist (asana, 2023).

Several industries, including engineering, education, computer programming, and project

management, employ flowcharts. They are an effective instrument with a wide range of
applications that may be tailored to assist find process defects and bottlenecks. The best
technique to create a flowchart is ultimately the one that makes the process understandable to all
parties (asana, 2023).

What is Coding Paradigm?

A core strategy or manner of producing code is referred to as a "coding paradigm." It is a

collection of guidelines and methods for structuring and creating software systems. Each
paradigm offers a distinctive approach to problem-solving with programming languages. For
instance, procedural programming, which emphasizes step-by-step execution and modular
decomposition, organizes code into procedures or functions that change data. Contrarily, object-
oriented programming promotes code reuse and modularity via the use of ideas like classes and
inheritance and centers on objects that contain data and activity (MV, 2019).

With an emphasis on immutability, pure functions, and higher-order functions, functional

programming views computing as the evaluation of mathematical functions. Imperative
programming relies on explicit statements and commands, whereas declarative programming
focuses on articulating the intended outcome rather than the specific methods to get there. Event

8
Unit 1: Programming

handlers or callbacks are used in event-driven programming to react to events or user actions.
Multiple tasks can be carried out concurrently in concurrent programming, which frequently uses
threads or processes. The best paradigm to choose will rely on elements including needs,
linguistic skills, and team preferences. Each paradigm has strengths and is suitable for certain
problem areas (MV, 2019).

Procedural paradigm

Programs built using the procedural paradigm are organized around functions or processes. It
focuses on following instructions step-by-step. In this paradigm, the program is broken up into
smaller, reusable functions that manipulate data, and the flow of control is established by explicit
instructions. The principles of "top-down" design are the foundation of procedural programming,
which places a strong emphasis on the reuse and modularity of code (Bhatia, 2022).

Object Oriented

The paradigm of organizing code known as Object-Oriented Programming (OOP) places an

emphasis on objects, which are instances of classes. It emphasizes the incorporation of activity
and information into objects that can use predetermined interfaces to communicate with one
another. Polymorphism, inheritance, and encapsulation are all promoted by OOP. Programs are
created according to this paradigm by first creating instances (also known as objects) of the
classes that describe the characteristics (such as data) and methods (such as activity) of objects
(Nyakundi, 2022).

9
Unit 1: Programming

Event Driven paradigm

Event driven writing computer programs is a programming worldview where occasions, for
example, client activities, sensor information sources, or messages from different parts, control
the program's execution. In occasion driven programming, the program is organized around
callbacks or occasion controllers that respond to specific events. When an event occurs, the
appropriate event handler is called, allowing the application to respond appropriately. Event-
driven programming is frequently used in graphical user interfaces (GUIs) and asynchronous
programming when responsiveness and event handling are crucial (Sayfan, 2022).

Overview of the application

The software will be built for the web platform using JavaScript programming language. Also,
using JavaScript framework i.e. Next.js. A well-liked open-source framework called Next.js is
used to create server-rendered React apps. It is based on React and offers more features and
functionalities to make the development process easier. The production-ready capabilities and
solid development environment offered by Next.js make it simple for programmers to create
scalable, fast React apps (Grabski, 2023).

Analyzing the requirement

Based on the requirements mentioned in the introduction part, we will have a form on the
webpage which will take inputs from the users (Pham , 2019).

The input fields are as follows:

- Athlete name
- Training plan (with multiple options i.e. beginner | intermediate | elite)
- Current weight (in kg)

10
Unit 1: Programming

- Target weight (in kg)

- Private coaching hours
- No. of sauna sessions
- No. of swimming sessions

Procedure for the application

For the calculator app to work, we need some mechanism to take input from the user, process
that input based on the specified fees, and show the user the processed output (Pham , 2019).

1. We are using a web HTML form to take input from a user.

2. Calculate those inputs i.e. Training plan, Private coaching hours, No. of sauna sessions,
No. of swimming sessions, etc. based on the specified fees by the company. For that, we
will design a simple algorithm that will process those inputs and return the output of the
monthly fees.
3. After the inputs are processed, we will show the user their monthly fees as an output on
the webpage (Pham , 2019).

Detailed steps for the program and Design of the Algorithm

Here is the design of the algorithm based on the inputs mentioned earlier. All the fees are given
by the company (Upadhyay, 2023).

1. Start the program.

2. Show the HTML input form page.
3. Create a class and define the properties to store inputs. Also, write a function method to
calculate the inputs and return an object with the processed output. The output object
contains the following properties,
a. athlete_name

11
Unit 1: Programming

b. training_plan
c. private_coaching_fees
d. sauna_fees
e. swimming_fees
f. current_weight
g. target_weight
h. total_monthly_fees
4. Take inputs from a user and store each input in the variables.
5. Listen to the submit button on click event.
6. As soon as the user clicks the button, start calculating the fees.
7. Check the selected training plan by the user,
a. If the plan is a beginner, the monthly fee is Rs. 4000.
b. If the plan is an intermediate, the monthly fee is Rs. 8000.
c. If the plan is elite, the monthly fee is Rs. 12000.
8. Multiply the private coaching hours by the company fee i.e. Rs. 500.
9. Multiply the no. of sauna sessions by Rs. 1500.
10. Multiply the no. of swimming sessions by Rs. 500.
11. Add all the prices i.e. training_plan, private_coaching_fees, sauna_fees, swimming_fees
to get the final total monthly fees.
12. After all the processing, display the output on the webpage.
13. Clear the HTML form for new input (Upadhyay, 2023).

Conclusion

In conclusion, the program displays an HTML input form page to begin with before creating a
class to store inputs and calculate fees. It determines the total monthly costs based on the
selected training plan, private coaching hours, swimming sessions, sauna sessions, and user
input. The handled result is then shown on the page, and the HTML structure is cleared for new
info.

12
Unit 1: Programming

What is Coding Standard?

Developers that write source code adhere to a set of rules, recommendations, and conventions
called coding standards. Ensuring quality and uniformity, make the code simpler to read,
comprehend, and maintain. A programming language's coding standards include a variety of
topics, including file structure, indentation, comments, name conventions, and more (Bose,
2023).

There are several advantages to having coding standards in place. It keeps the code simple, and
manageable and minimizes complexity. A clearly defined and standardized coding style is
maintained with a high priority by good software development organizations. Depending on their
requirements and the kind of software they generate, companies design their coding standards
(Bose, 2023).

When creating coding standards, the most effective procedures should be followed. A few
examples include prioritizing documentation, prioritizing readability, standardizing module
headers, employing unique identifiers, performing frequent backups, leaving comments,
prioritizing readability, setting up adequate exception handling, and so on. By implementing
these strategies, businesses can ensure uniformity among development teams, enhance software
quality, and foster cooperation (Bose, 2023).

Why Coding is important?

Coding standards are crucial for several reasons, such as:

- It serves to maintain consistency in the code by ensuring that all developers working on a
project adhere to the same rules and regulations.
- It makes code simpler to read and comprehend, which facilitates developer interaction
with the code and lowers the risk of mistakes.

13
Unit 1: Programming

- It assists in lowering the complexity of the code, making it simpler to maintain and adapt
over time.
- By adhering to accepted coding standards, developers may avoid creating new issues and
make changes to the code more quickly and easily, which can cut down on the time and
expense of development (Bose, 2023).

Coding Standard used in the application

The Best fitness calculator app uses simple yet elegant coding standards that can be beneficial
for the team for continuous development, collaboration, and adaptability.

1. Import Statements: The code follows the convention of importing modules using the ES6
import syntax. Each import statement is placed at the top of the file and separated by line
breaks.
2. Variable Declarations: Variables are declared using the const keyword for values that do
not change and the let keyword for values that can be reassigned. The variables are
named descriptively to convey their purpose.
3. Interface Declaration: The Cost interface is defined using the interface keyword to
specify the shape of an object. It includes optional properties and their respective types.
4. Export Statement: The export default statement is used to export the Home component as
the default export of the module.
5. Function Declarations: Functions are defined using the function keyword or arrow
function syntax. They are given meaningful names and follow the standard conventions
for parameter naming.
6. JSX Markup: The JSX markup follows the convention of using self-closing tags for
empty elements and enclosing elements in proper parent-child relationships. Class names
are assigned using the className attribute, and conditional classes are applied using
template literals and logical operators.
7. Code Formatting: The code is formatted correctly, using consistent line breaks and proper
indentation, making it easier to read and more organized (Gralha, 2022).

14
Unit 1: Programming

Overall, the coding standard used in this code aims to promote clarity, readability, and
maintainability by following conventions commonly used in React and JavaScript development.

Implementing the proposed algorithm in the Best Fitness Calculator App

Here is the implementation of the algorithm which is the heart of the Best Fitness fee calculator
app.

- Define an onSubmit function that takes an object which consists of the input values
provided by the user.
- Initialize the cost object with default values.
- Calculate the training fee based on the selected plan.
- Add the training fee to the total cost.
- Set the name, current weight, and target weight in the cost object.
- If sauna sessions are selected, calculate and add the cost of sauna sessions to the total
cost.
- If private coaching hours are selected, calculate and add the cost of private coaching
hours to the total cost.
- If swimming sessions are selected, calculate and add the cost of swimming sessions to the
total cost.
- Set the output or state variable to the cost object.

Here is the final code of algorithm implementation,

15
Unit 1: Programming

16
Unit 1: Programming

Challenges faced while implementing the algorithm into code

- Code Structure: Learning JavaScript and React's code structure takes time, especially
when dealing with new libraries and component interactions.
- Resolving Dependencies: Installation and figuring out import paths for third-party
libraries like react-hook-form may be difficult, particularly when dealing with version
compatibility.
- Verifying a form is important to comprehend the functioning of react-hook-form and
class-validatorResolver before using them for validation.
- State management: As the application becomes more sophisticated, managing and
updating the state with React's useState hook might be difficult.
- Data formats, validation, and computations must all be carefully considered to handle
user input and conduct calculations effectively.
- UI/UX Design and Styling: Creating a user-friendly interface and applying HTML and
CSS classes to it can be difficult, especially if you lack front-end or CSS knowledge.
- Testing and Debugging: In a complicated application, it might be difficult to ensure the
code's accuracy and dependability through rigorous testing and efficient debugging
(Upadhyay, 2023).

17
Unit 1: Programming

Final project

Debugging Javascript with IDE

The following procedures must be taken to debug in Visual Studio Code (VS Code):

- Install the Debugger: Run "Debugger for JavaScript" or "Python" to install any required
debugging extensions for your programming language.
- Set Breakpoints: Insert breakpoints where we want them in our code. A breakpoint is a
marker that instructs the debugger to stop the program's execution at that particular line.
- Launch Configuration: To specify how the debugger should run your code, create a
launch configuration file (launch.json). Set the program's starting point, runtime
arguments, and any other necessary parameters.
- Start Debugging: To begin debugging, use the F5 key or the debug button on the sidebar.
Your application will run in debugging mode in VS Code and halt at the breakpoints.

18
Unit 1: Programming

- Debug controls: You have the option of continuing the current execution (Continue),
stopping the program entirely (Pause), or walking through the code (walk Over, Step
Into, Step Out).
- Examine Variables: When debugging, you may look at the values of the code's variables
and expressions. To see a variable's current value, use the debug sidebar or mouse over it.
- Create watch expressions to continually monitor the value of a certain variable or
expression. As we navigate the code, Visual Studio Code will show us its values.
- Debug Console: During a debugging session, we can run arbitrary code or print debug
output using the debug console. While the software is pausing, we are still able to interact
with it.
- Breakpoint Actions: Add conditions or actions to modify breakpoint behavior.
Breakpoints may only be set to activate under particular conditions, and actions enable us
to report messages or change variables when a breakpoint is reached.
- VS Code will provide a stack trace and the appropriate error messages while our code is
being debugged to assist us in locating the issue's source.
- Additional sophisticated debugging tools are available in VS Code, including multi-
threaded debugging, remote debugging, and attaching to running processes (Sayantini,
2022).

Detailed procedure versus code for debugging in order to construct a more robust and
secure application

One of Visual Studio Code's most notable features is the excellent debugging assistance it
provides. Using VS Code's built-in debugger will speed up the edit, build, and debug loop
(Sayantini, 2022).

19
Unit 1: Programming

Debugger extensions

VScode has built-in debugging support for javascript but we can leverage the power of
debugging even further by installing additional extensions (auth0, 2023).

20
Unit 1: Programming

Debug and run view

To open the Run and Debug view, select the Run and Debug icon in the Activity Bar on the side
of Visual Studio Code. Another available keyboard shortcut is Ctrl+Shift+D (Samaranayake,
2022).

The Run and Investigate view contains a top bar with troubleshooting orders and arrangement
choices, and it shows all data about running and investigating. If running and debugging have not
yet been set up (no launch.json has been produced), VS Code displays the Run start view
(Samaranayake, 2022).

21
Unit 1: Programming

Actions Debugging

Once a debug session has begun, the Debug toolbar will appear at the editor's top.

Action Explanation

Continue / Pause Continue: Resume normal program/script execution (up to the next
F5 breakpoint).

22
Unit 1: Programming

Pause: Inspect code executing at the current line and debug line-by-line.

Step Over Execute the next method as a single command without inspecting or
following its component steps.
F10

Step Into Enter the next method to follow its execution line-by-line.

F11

Step Out When inside a method or subroutine, return to the earlier execution
context by completing the remaining lines of the current method as
Shift + F11
though it were a single command.

Restart Terminate the current program execution and start debugging again
using the current run configuration.
Ctrl + Shift + F5

Stop Terminate the current program execution.

Shift + F5

Run mode

Versus Code empowers executing programs as well as investigating them. The Debug is started
with Ctrl+F5: The action known as "Run (Start Without Debugging)" makes use of the particular
launch configuration. There are a number of launch configuration attributes available in the

23
Unit 1: Programming

"Run" mode. VS Code keeps a debug session open while the application is running; clicking the
Stop button closes it (Samaranayake, 2022).

Breakpoints

During debugging, we may add breakpoints to your code to prevent it from running at a specific
line or circumstance. The program will stop when it comes to a breakpoint, allowing us to
investigate factors, go through the code line by line, and assess its way of behaving (chris, 2022).

To establish a breakpoint:

- Open VSCode and the file you wish to debug.

- Find the line where the breakpoint should be placed.
- Either click in the gutter to the left of the line number or press F9 when the cursor is on
the appropriate line. A red dot created by this action marks the breakpoint.
- You may choose to configure extra settings for the breakpoint, such as conditions or log
messages, by selecting it using the right-click menu (chris, 2022).

The troubleshooting meeting might be begun whenever you've set a breakpoint by picking the
legitimate troubleshooting settings, hitting F5, or tapping the "Begin Troubleshooting" button in
the toolbar. The program stops running at the breakpoint for the remainder of its execution
(chris, 2022).

You may move through the code and examine its state when the program is halted at a
breakpoint. You can also investigate the values of variables and run commands on the debug
console. You may browse the code using VSCode's different debugging commands, such as
stepping over a line (F10), stepping into a function (F11), and stepping out of a function (Shift +
F11) (chris, 2022).

24
Unit 1: Programming

Logpoints

Additionally, VScode has a function called "Logpoints" that enables you to log information to
the console without stopping the program from running. When you don't want to pause the

25
Unit 1: Programming

execution of the code as you would with breakpoints, you may use log points to collect data on
the behavior of the program at particular points (MacDonald, 2019).

These procedures should be followed to create a log point in VSCode:

- Open VSCode and the file you wish to debug.

- Find the line on which the log point is to be inserted.
- Either right-click the line number or click in the gutter space to the left of it.
- Choose "Add Logpoint" from the context menu, or press Ctrl+Shift+F5 on a Mac or
Windows computer (MacDonald, 2019).

When the log point is reached, a dialog box will pop up where you may type the log message you
wish to show. Placeholders for variables can be added by surrounding them in curly braces. For
instance, you may use the symbol x in the log message to log the value of the variable x
(MacDonald, 2019).

Once the log message has been entered, select "Set Logpoint" to establish the log point. The
provided log message is sent to the console output when the application hits the log point during
execution (MacDonald, 2019).

The utilization of log focuses permits you to gather information at runtime and inspect variable
qualities without stopping your program's execution. They can be extremely helpful when
introducing breakpoints that would be disruptive or impossible to implement (MacDonald,
2019).

Inspection of Data

The process of looking at and studying the values of variables, data structures, or expressions
while a program is being executed is known as data inspection. It is a crucial component of
debugging and troubleshooting since it gives you knowledge about the state and behavior of your
code at various stages of execution (Kroonenberg, 2021).

26
Unit 1: Programming

There are several options for inspecting data while debugging:

View Variables: The Troubleshoot sidebar's factors view shows the factors' latest qualities. To
view their contents, objects, arrays, and other data structures can be expanded and collapsed.
Additionally, it makes it easier to evaluate expressions and the results of those evaluations
(Kroonenberg, 2021).

Hover: While debugging, if you place the mouse pointer over a variable or expression in your
code, a tooltip showing the value will appear. By using this functionality, values may be quickly
inspected without having to open extra views (Kroonenberg, 2021).

Watch Expressions: In VSCode, you may configure watch expressions to continually monitor
particular variables or expressions. Every time the application pauses, watch expressions are
evaluated, allowing you to see the evolution of their values. Watch expressions can be added
either directly in the Watch view or in the Variables view (Kroonenberg, 2021).

Debug Console: During a debugging session, you may run arbitrary code and evaluate
expressions using VSCode's Debug Console. By pressing the standard keyboard shortcuts
Ctrl+Shift+Y (Windows/Linux) or Command+Shift+Y (Mac), you may access it by selecting the
"Debug Console" button in the Debug toolbar. JavaScript expressions allow you to display
variable values, invoke functions, and interact with the program's state (Kroonenberg, 2021).

27
Unit 1: Programming

28
Unit 1: Programming

(Read-Eval-Print Loop) REPL Debug Console

During an investigating meeting, the Read-Eval-Print Circle (REPL) climate presented by the
Troubleshoot Control center empowers you to intelligently run code and assess articulations. The
Debug Console REPL is an interactive console that lets you enter JavaScript code and see the
results right away (Zack, 2022).

To go to the REPL for the Debug Console:

- By placing breakpoints or utilizing other VSCode debugging tools, begin a debugging

session.
- By clicking the "Debug Console" button in the Debug toolbar or by pressing the standard
keyboard shortcut Ctrl+Shift+Y (Windows/Linux) or Command+Shift+Y (Mac), you
may access the Debug Console if the program reaches a breakpoint or experiences an
error.

29
Unit 1: Programming

- The Debug Console REPL, which lets you enter JavaScript expressions and view their
results, will show up at the bottom of the VSCode window (Zack, 2022).

Assessment report on generally speaking application with the interaction in question,

calculation plan and execution, and the coding principles

Implementation of Algorithm

The algorithm of the Best Fitness calculator app has been effectively incorporated into the code.
To handle the client inputs and decide the month to month expenses in light of the picked
preparing plan, confidential training hours, sauna medicines, and swimming meetings, the
calculation utilizes a bit by bit system. After precisely calculating the fees, the algorithm

30
Unit 1: Programming

generates the processed output, which includes the client's name, an itemized list of expenses,
and the monthly total cost of training. The introduction's criteria are precisely met by the
algorithm's implementation (Upadhyay, 2023).

The relationship between the written algorithm and the actual source code

The written algorithm provides a clear and concise description of the steps involved in the
calculation process. The actual source code reflects the logic and structure outlined in the
algorithm. The code implements the necessary functions and variables to handle user input,
perform the required calculations, and display the output on the webpage. The relationship
between the algorithm and the source code is well-maintained, ensuring that the code accurately
follows the intended algorithmic logic (Spacey, 2016).

The selection of an appropriate IDE (Integrated Development Environment) for

development

The IDE (Incorporated Improvement Climate) that was utilized immensely affected how the Best
Wellness application was made. The utilization of an IDE offers designers various benefits,
including project the board apparatuses, investigating capacities, and code altering offices.
Although the report does not specify the specific IDE that was utilized for this project, using a
well-known and efficient IDE would have significantly sped up the development process
(Codecademy, 2023).

The work would have taken longer and been more difficult without access to the IDE. IDEs often
provide capabilities like code completion, syntax highlighting, and error checking to aid
developers in writing code more quickly and with fewer mistakes. Issues during development
may be more easily identified and fixed thanks to the integrated debugging capabilities in IDEs.
Additionally, project management tools offered by IDEs frequently improve cooperation and

31
Unit 1: Programming

maintainability. Examples include version control integration and project structure organization
(Codecademy, 2023).

Overall, the use of an IDE has likely improved the development workflow, increased
productivity, and enhanced the quality of the code by providing a comprehensive set of tools and
features (Codecademy, 2023).

Coding standards roles and purposes

Both software development teams and lone programmers must adhere to the coding standards
used to create the Best Fitness application. Coding standards create a set of guidelines and norms
that guarantee the codebase's uniformity, readability, and maintainability (Gralha, 2022).

Coding standards foster teamwork and make it easier for team members to share code in
software development teams. It is simpler to comprehend and evaluate each other's code when
everyone in the team uses the same coding standards, which improves collaboration and reduces
conflict. Additionally, maintaining and updating the software over time is made simpler by
consistent coding practices, especially when numerous engineers are engaged (Gralha, 2022).

Coding standards assist lone programmers in producing orderly and clean code. Programmers
may make their code more readable and understandable, which makes it simpler to debug and
maintain, by adhering to accepted norms. Meaningful variable and function names, correct
indentation, and consistent code layout improve code understanding and lessen the chance of
making mistakes (Gralha, 2022).

For software development teams to assure uniformity, teamwork, and maintainability of the
codebase, coding standards are essential. Additionally, they help individual programmers by
encouraging the use of understandable, clean code (Gralha, 2022).

32
Unit 1: Programming

References

asana, 2023. When to use flowcharts. What is a flowchart? Symbols and types explained, 1(1),
pp. 4-10.

auth0, 2023. Authorize the extension. Authentication API Debugger Extension, 1(1), pp. 2-6.

Bhatia, S., 2022. What is procedural programming?. Procedural Programming [Definition],

1(1), pp. 1-5.

Bose, S., 2023. Purpose of having Coding Standards. Coding Standards and Best Practices to
Follow, 1(1), pp. 4-15.

chris, 2022. Debug Configurations. How To Run and Debug JavaScript and TypeScript in
VSCode, 1(1), pp. 1-8.

Cocca, G., 2022. What is a Programming Paradigm?. Programming Paradigms – Paradigm

Examples for Beginners, 1(1), pp. 3-4.

Cocca, G., 2022. What is a Programming Paradigm?. Programming Paradigms – Paradigm

Examples for Beginners, 1(1), pp. 3-5.

Codecademy, 2023. Editing Source Code. What Is an IDE?, 1(1), pp. 1-8.

Grabski, T., 2023. WHAT IS NEXTJS?. PROS AND CONS OF NEXT JS – 2023 UPDATED
VERSION, 1(1), pp. 3-8.

Gralha, C., 2022. What are coding standards?. Coding standards: what are they, and why do you
need them, 1(1), pp. 4-18.

Gralha, C., 2022. What are coding standards?. Coding standards: what are they, and why do you
need them, 1(1), pp. 2-5.

Kroonenberg, P. M., 2021. Abstract. Data inspection: The data are in. Now what?, 1(1), pp. 1-4.

33
Unit 1: Programming

MacDonald, M., 2019. Installing the Chrome debugger. Setting up JavaScript Debugging in
Visual Studio Code, 1(1), pp. 2-8.

MV, T., 2019. Introduction to programming paradigms. What exactly is a programming

paradigm?, 1(1), pp. 3-10.

Nyakundi, H., 2022. What is Object-Oriented Programming?. OOP Meaning – What is Object-
Oriented Programming?, 1(1), pp. 3-6.

Pham , T. B., 2019. What is Software Development?. 6 Stages for Software Development
Procedure You Need to Know, 1(1), pp. 2-14.

Samaranayake, M. D., 2022. Debugging Methods for JavaScript. JavaScript Debugging with VS
Code and Chrome, 1(1), pp. 2-9.

Sayantini, 2022. What is Debugging?. What is Debugging and Why is it important?, 1(1), pp. 2-
7.

Sayfan, G., 2022. What is event-driven programming?. Introduction to event-based

programming, 1(1), p. 3.

Sayfan, G., 2022. What is event-driven programming?. Introduction to event-based

programming, 1(1), pp. 4-9.

Spacey, J., 2016. Algorithm implementation. Algorithm VS code, 1(1), pp. 2-7.

Upadhyay, S., 2023. What is an Algorithm?. What Is An Algorithm? Characteristics, Types and
How to write it, 1(1), pp. 4-8.

Zack, 2022. Launch Configurations. How to Debug Node.js Program with VS Code?, 1(1), pp. 3-
8.

34
Unit 1: Programming

35