• Forum updates

    We have done some forum updates. Please check out the thread here.

New project in the works: ggx2ac and the archives of Nintendo earnings data and other video game companies (title pending)

ggx2ac

(They publish Dark Souls)
Member
Link to the webpage: https://r134x7.github.io/nintendo-earnings-data-and-other-video-game-companies/

Context, I needed to continue working on my programming skills to build my portfolio. So I thought I may as well use my Python code output of the Nintendo earnings data and build a webpage on GitHub pages.

For clarification, GitHub pages hosts only static webpages. So don't expect much functionality, there is no database for someone to make an account and post things on there. It's basically what you see is what you get.

Now you may be wondering, am I making money from it? No, there's no ads and I'm even giving free advertising to Install Base by mentioning it on every page (except the 404 page because I forgot).

Now that is out of the way, what makes my webpage different to posting the archived data here in my old thread? (The old thread if you want to compare: https://www.installbaseforum.com/fo...data-from-fy3-2017-to-present-for-switch.205/ )

The webpage has some very basic features and it is still under construction, I just wanted to get a working portion done just to show everyone what it looks like. Please note, I did reuse code from one of my previous projects just to get this done pretty quickly of which I'm referring to the style of the site mainly.

I assume that someone knowledgeable in web development is going to ask what I used to build the webpage so for those that are savvy, it's under this spoiler:
- React in TypeScript (Note: I am only just using TypeScript so I know I am not using it properly.
- Mantine (React Component Library) (provided things like the app shell and the dark theme)
- React-router-dom for url linking
- Chart.js and react-chart-js2 for creating the graphs
- tabler-icons-react for the icons that are next to buttons (probably only one I counted)
- Redux Toolkit for state management (used for the ColorPicker to apply the color to components)

Since I said the page is under construction there is not much you'll be able to see, if you want to see something, go to the webpage, then click on the Nintendo button, search for FY3/2022 (note that the description above the search bar changes when you enter a year).

When you search that year, you should see buttons pop-up below, if you are using a keyboard you can scroll between them with the arrow keys, doing so will show you the relevant Nintendo earnings data for FY3/2022.

The background colour for the earnings code output is defaulted to grey, if you want to change the colour you would have noticed the "colour picker" next to the search bar, use that to change the background colour of the earnings code, note that while you are selecting an RGB colour, I used a .reduce function to change it into an RGBA colour which means all the colours have a fixed 20% opacity so that you don't get blinding colours.

At the bottom of the page of the earnings, you should have noticed a chart. I quickly whipped up a chart using the Top Selling Titles data for FY3/22. You will notice that the colour you pick for the background also affects the colour of the chart however, there is also default colours but these only occur when you click on one of the buttons to add a second dataset to your charts and yes, they're based off the GameCube colours. Click on the "page buttons" to cycle through the 11 games that can appear on the chart. You have the option of either using a Line chart or Bar chart.

There is a reason I am letting users only have up to two datasets on a single graph. I noticed that you can actually right-click and download the image of the chart meaning it's very easy to share online. That also means it's very easy for people to make bad graphs hence why I limited the amount of data sets you can add to a graph to only two.

I'm not really enthusiastic about the charts at this time, that's why it is only a demonstration at the moment.

Because the webpage uses JavaScript, it means that if I want to get the most out of my webpage, I will have to make new code from scratch once again like the code I made in Python for the Nintendo earnings data threads.

Lastly, you're probably wondering but no, this webpage is only for archived data and not the most recent data. I am still going to be making earnings release threads with the tables you have seen before so I won't even update the webpage with data from FY3/2023 until the fiscal year ends which is next year.
 
Event Calendar added
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
Once again the link to the webpage: https://r134x7.github.io/nintendo-earnings-data-and-other-video-game-companies/

There are two things I have added. The webpage is now using hash routing from the react-router-dom package, you will now see a " #/ " in the URL, what this means is, if you were someone who was using the page before this update and you refreshed the page you would have received a 404 error. This is just due to how GitHub pages works on single page apps like React.

So yes, go to the page right now and click on any of the menu buttons that isn't home and go and refresh and it will work.

The other update is there is now a new page called events. Go to it, look at the calendar and then click on the calendar dates that have a spot on them...

Just letting you know that what I wanted to do to get the calendar working like it is now wasn't easy and it still wasn't the solution I was looking for regarding using multiple dates (in the code) because of how the Mantine component library designed their Calendar functions...

Anyway, I always use a calendar for upcoming earnings results. I just added only a few dates to the calendar to show how it works. Note: You should not rely on my calendar if there are things you follow and I don't have it listed and no, I am not going to add hundreds of different things to the calendar. The calendar as it is right now is a demonstration and other than special events is mainly for listing earnings announcement dates and even with those, I am not going to list the dozens of companies that have earnings releases when I only bother to follow less than ten of them.
 
Webpage update, consolidated earnings file complete.
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
This is the latest update to ggx2ac and the video game earnings data archives of doom (title pending).

I am currently building new code from scratch in TypeScript, I am not doing a "port" of my Python code to have it run in TypeScript. I am essentially building from scratch and... it's either a remake or a sequel. I making the TypeScript code do the exact same output that my Python code does but it is not doing the exact same methods I used in Python. For one, I am not using for loops. This meant having to understand how to use map, filter and reduce methods correctly.

For any programmers that are curious about how my code looks in TypeScript compared to Python, the links are behind this spoiler:

Yes, you will have noticed that the hardcoded data is not there. It is now in separate folders that I only have to import the functions now and run them with the data instead of copying and pasting the same code for every year.

With that out of the way, you're probably wondering, why would I go through all the trouble to re4make this code when I can just paste the Python output like I already did in the FY3/22 code? By re4making this code in TypeScript, it means I can do things with the data I am creating.

The webpage has been updated and you can now view from FY3/17 to FY3/22 all the Consolidated Earnings Data i.e. Net Sales, Operating Income, Operating Margin and Net Income. Not only that, if you scroll down the page you will notice the familiar graph at the bottom. With it you can view data for the current fiscal year and compare it with the previous fiscal year in Line or Bar form.

That is all for the latest update.
 
Webpage update, KPI file complete. Test-driven development.
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
This is the latest update to ggx2ac and video game earnings data: World (title pending)

This is a quick update compared to when I last posted, but don't expect the later updates to be as quick. I picked the easiest file to work on which was the KPI/Digital Sales Indicators. Not only is the re4make of the file done and the print of the table up on the webpage but you can also view the graphs right now too. One difference you will notice regarding the graphs in comparison to the table is that you will get to view Year-on-Year data (except when viewing FY3/17 because I couldn't find any KPI data for FY3/16 in the supplementary info file although I didn't have time to look through everything to see if I could use something since it's just percentages of data from their earnings releases).

A reminder that when you are viewing the webpage on your phone, if you want a bigger view of the chart, you would need to put your phone in landscape mode.

Next part is about test-driven development (testing all your code before running it) which is related to how things changed compared to yesterday when working on the code. Before I moved onto working on the KPI file, I had to reassess what I was going to do because it was a bit of a mess and it took a while building the foundations with the earnings-logic. From what I noticed was that I was testing my code a lot to check that it worked. The issue was I didn't pick the correct environment to get that to work. With TypeScript and working on the earnings-logic, I didn't want to want to have to compile the file into JavaScript every time I wanted to run it including that since the webpage was front-end only, I would have needed to run the webpage on the browser to even check the console.log. So what I did at the time was using the TypeScript Playground to run the code on there so I could console.log the earnings-logic. This worked but it was very inefficient since I would have to copy the code back to the text-editor and make sure that both the text editor and whatever was in the TypeScript Playground was up to date but I had to also remove "export" statements while using the TypeScript Playground to get the code to run.

Since I had noticed I needed to test the code a lot especially to make it match the output from my Python code files, that was when I realised that I should be using Jest (which is installed along with the NPM React TypeScript). For those that don't know, Jest is an NPM package used for testing JavaScript code before running it on anything. It also supports TypeScript. With that I was able to drop the TypeScript Playground and create test files instead. Note, I have barely done any test-driven development and I wasn't going to test everything I wrote, only the things that I knew I would need to check.

Here are two images to show Jest in use, I am testing that the code that I make in TypeScript is going to output a string that will match the string from the Python code:

- This is part of what happens when a test fails:
pain21.jpg


You will see that the test failed because my code had an extra line added under 1st Half while the Python code output doesn't have that.


- This is what happens when you pass all the tests:
pain22.jpg


Know that you don't have to write code that needs to pass a test, it's not there in the screenshot but I did another test that just console.logged everything that I needed to print and I was not going to have it match my Python code because I had already made changes to the output of the KPI file to make it look better and more consistent. You can see how it looks on the webpage.

As you can see from the tests listed, I had to make sure that every quarter worked correctly and if my code contained any if statements (like how the digital sales indicator uses currency and not a percentage) then I would have to test for those cases too.

If I had used Jest from the beginning for this project then I would have most likely gotten the earnings-logic file done much quicker since I wouldn't have needed to switch between windows having to update code and the tests from Jest would have easily told me whether the test I made had passed.

That is all for the latest update.
 
small webpage update and, the cycle of refinement
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
This is the latest update to ggx2ac and the Nintendo earnings archives... etc etc... (title pending).

Here's your webpage update, when you view the Nintendo section there are some small changes. The default colour for the tables and graphs have changed to match the colour theme of the website.

There is no more analogue colour picker, it has been replaced with swatches of which there are 21 swatch colours to choose from. This was intended to make it easier to pick a colour especially when your colour choice isn't saved anyway. Another small change, you will have feedback when you select a colour, it will tell you the rgba values (note, the "a" value for the colours on the graph is always 100% and not 20% like in the tables.) Lastly, two sets of swatches appear on the page, one next to the search bar and then the other at the bottom of the page when there is a graph to make it more easier to select a colour while at the bottom of the page. No, there is still no colour selection available when you want to view

My last update was several days ago and this update is rather small, what have I done? Since I am just learning TypeScript, I had gone over Nintendo my Earnings and KPI files to refactor the code since there was plenty of room for improvement. You might think, "The code is working, why does it need improvement?" it's pretty simple to explain. This is not a "one and done" project, since there is new earnings data that appears every quarter and the data that appears is not constant, that means the code used has to scale well with what is occurring.

For example, my Python code is not maintainable because it doesn't scale well. That was one of the issues I was addressing when writing my TypeScript code. It's not just for scaling up but also for scaling down. You're probably wondering what examples are there, when I was using my Python code that was built based on data from FY3/22 which had things like... Switch OLED and the Switch Lite and tried to apply that code for data from FY3/17 where those models hadn't existed yet, I ran into problems where changes couldn't be easily made without having to do a lot of work.

With my new TypeScript code, I don't have to go back and fix up my Python code since it is outputting what I want anyway. How did I assess what needed to change to improve my code? There is this thing called the DRY principle meaning Don't Repeat Yourself. Obviously my first thought is to get something working before I worry about having to remove code that is just repeating itself, I then refine the code afterwards.

What is an example of code that is repeating itself? You would remember that back in my other thread I made a post about recursion to solve a problem where I had an array that needed to be summed up at different indexes and not just the total. As the length of the array gets longer, so does the amount of lines used for the "if else" statement that was made. If your "if else" statement continues to get longer because more conditions are appearing due to the array getting longer then you really have to assess whether the conditions are just repeating themselves and if you can find a solution to not create a "pyramid of doom". In that recursion function I made, there was still improvements that could have been done i.e. if x == (y1[0] + y1[1] + y1[2] + y1[3]) and i == 4: return. The y1 array needs to be summed without having to list every index, and the variable "i" just needs to equal the length of the y1 array. How would I sum up the indexes in the array? By using array.reduce, obviously I didn't know array.reduce back then and had I known it then I wouldn't have needed to make my own recursion function.

Now that I have finished refactoring the earnings and KPI code, I can move onto creating the next thing which should require less refactoring since I have a base to work from.

That is all for the latest update.
 
Webpage update, top selling Switch titles file complete.
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
Link to the webpage as usual: https://r134x7.github.io/nintendo-earnings-data-and-other-video-game-companies/

This is the latest update to ggx2ac and the video game earnings archives ^ core plus (title pending).

I have just finished the top selling Switch titles file, compared to the old thread you are familiar with you will now notice something different in comparison when you look at the tables... All the titles are sorted now (titles were sorted on FY3/22 python code data but not previous FYs) .

table1.jpg


Regarding the graphs for the top selling Switch titles, you would remember when I first did a demonstration back in the first post, you would have noticed that the top selling Switch title graphs only had the quarterly data and not the cumulative data.

So it's pretty obvious as to what I have added...

Stacked line graphs for one title:
chart6.png


Stacked line graphs comparing two titles:
chart7.png


Stack bar graphs for one title:
chart1.png


Stacked bar graphs comparing two titles:
chart5.png




That is all for the latest update.
 
Webpage update, fiscal year million seller titles file complete, one new addition.
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
Link to the webpage as usual: https://r134x7.github.io/nintendo-earnings-data-and-other-video-game-companies/

This is the latest update.

I have just finished the FY million seller titles, go search through each fiscal year and look at the FY million-seller titles which are sorted by rank and have a summary at the bottom of the page.

There are no graphs for the FY million seller titles at this time. I spent my time doing something else, when you go to the search bar, you will see a new item on the list called "Special Page". Go to it.

That is all for the latest update.
 
webpage update, Worldwide Hardware/Software units file complete. Python vs JavaScript/TypeScript Part 1 New
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
This is the latest update of which the update was already up hours ago. I made a separate thread for explaining Nintendo Switch Sales Per Hardware Unit so go there if you want an in-depth explanation on that topic: https://www.installbaseforum.com/fo...s-of-june-30-2022-redux-of-an-old-topic.1031/

So now I'll go off-topic and talk about the programming languages Python, JavaScript and TypeScript.

This is mainly intended for people not familiar with programming. So if you had been following what I do, you will have known that previously I made the tables for the Nintendo earnings threads using Python. I am now going to do that using TypeScript. However, what is the difference between these programming languages? Let's see if I can explain the necessary parts well without having to look up resources...

First off, the Programming Language A vs Programming Language B is just clickbait. There is no objectively best programming language, there will be a difference between programming languages you prefer to use vs programming languages which are more easily suited to a task.

While I am aware that I could have made my webpage using Python by utilizing the Web Frameworks such as Django or Flask, I went with using JavaScript because it is so much quicker and easier putting the webpage up on GitHub especially as it's a front-end only webpage. If I went to make the webpage using Django then I wouldn't be able to use GitHub to host the page and hence I would have to take extra steps to get it up and working.

Don't worry if you're not familiar with any of those words.

There are many programming languages out there and you could literally make your own programming language and if it creates a community then more and more and more people might use it. Examples of programming languages that grew from a community would be: C++ and, Python are ones I am certain of. There are programming languages that didn't grow this way, Java is an example of a programming language backed by enterprise with a massive advertising budget whose goal was to get C++ programmers to use Java. Quick side note, Java and JavaScript are different programming languages as well, JavaScript was originally called Mocha but then changed to JavaScript because marketing.

I'm getting off-topic from the off-topic. What is a programming language? Think of it as a language that you use to tell a computer to execute a set of instructions. Programming languages can be human readable which are High-Level languages that have syntax that a human can read and understand. Low-level languages are more complex as the syntax gets closer and closer to how a machine would read your code. A programming language would use a compiler, a compiler takes the code that you wrote and then converts it into code that a machine can understand to execute your set of instructions.

The programming language C is considered a Low-level language today but, hilariously enough this is all relative because when C came out it was considered a High-level language while the programming language Assembly was a Low-level language in comparison.

So now you understand that a programming language is a way for you to tell a computer to do things, if you have not programmed before, now is a chance for to try it out very briefly.

Whether you are on your phone or desktop, go to: https://www.typescriptlang.org/play
That is the TypeScript playground from the official TypeScript website, with it you can actually play around and code something. The majority of programmers that ever learned programming started with telling the computer something very simple and that is to print on the screen: Hello World.

If you have not been to that TypeScript link before, there will be a premade example, the green text is code that is commented out by using the // syntax that makes any text after // become a comment which makes a computer ignore the text when compiling.

You will then see code that is not commented out, there is blue text of the word const, const is short for constant and is a variable of which it is not mutable. A variable in programming is similar in the mathematical sense in algebra where x is equal to some value. In this case the variable is not named x, it is named anExampleVariable. A variable that is mutable means it can mutate and change its value, variables that mutate can lead to unexpected bugs which is why immutable variables are more preferred to avoid bugs. In JavaScript/TypeScript, const is when you want to use an immutable variable, var is when you want to use a mutable variable. Next, the = sign is used to indicate that anything on the right side of it is what is contained inside the variable, in the example on the TypeScript Playground it will be a string that says "Hello World". A string is a bunch of characters and the compiler knows that it is a string by enclosing the characters in double quotes "", single quotes around a set of characters also creates a string in JavaScript.

On the line below the variable there is a command that says, console.log(anExampleVariable), console.log is JavaScript's version of print and the reason why you have to tell it console.log to print something is because that is the location of where it will be printed.

So you aware these are the instructions that you are giving the computer but you have not told it to do anything yet. Before you click on the Run button which is on the row above all that code, go back to the const variable and change the string from "Hello World." to "I am now a programmer". The history of Hello World stems from the C programming language so that's how it became the go to starting point for any programming language after C, the very first thing you do is print a string saying Hello World on the screen and that's it.

Assuming you have now followed the instructions correctly, you can now click on the Run button and the code will be executed. If you are doing this from your phone, after you have clicked on Run, look right side of that row where there is an arrow, click on it and it will open a side tab, click on the button that says Logs and it will open up the console log.

If you have followed everything correctly then your screen should look similar to these two images on a phone:
Screenshot_20220902-152302.png

Screenshot_20220902-152313.png


This is now the start of something new if you continue to learn and apply it.

Considering how long it took just to write up some basics of "What is a programming language", the comparison of Python to JavaScript will have to wait another time.
 
webpage update, regional hardware/software file complete. New
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
This is the latest update of ggx2ac + archives: Nintendo earnings data and other video game companies.

The code for regional hardware/software data is complete. I have made adjustments to how the table looks, see the image below. The left image is the old table, the right image is the new table:
pain42.jpg


I chose to space things out vertically so that everything isn't so squeezed together.

At this point, all the files for the logic have been complete. I will now move onto adding the data for FY3/23 and then, I will continue working on the charts.
 
webpage update, graphs added, separated special page, FY3/23 data. New
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
This is the latest update.

Since I have updated the webpage now with Nintendo earnings data up to FY3/23, I no longer need to link my earnings release thread on the Nintendo page. Instead, I am linking @Celine 's thread of historical Nintendo data.

Also, I have now added graphs for almost every section for each fiscal year not called FY3/17 except the Regional Hardware/Software data, I am not going to bother with graphs for Regional Hardware/Software data because there are too many points so I would rather have users read the tables instead.

I have updated the special page with the latest data and also separated it from the fiscal years, the reason being is that I want to be able to search different fiscal years with little effort, when you add Special Page to the search function it means I would have to delete every word to search a fiscal year compared to when I only have to delete one or two numbers to change to a different fiscal year.

So now when you go to the Nintendo page you will see a new row of buttons to select between "Data by Fiscal Year" and "Special Page".

For the top selling titles graphs and the fiscal year million seller titles graphs, they are different to the other graphs you'll see because they are using logarithmic scaling, not linear scaling. The reason for this is to see the data better, when you have numbers that are magnitudes in difference, you need logarithmic scaling to see it better.

The colour buttons for the colour picker are now bigger.

That is all for the latest update.
 
Moving onto Capcom section, Python vs JavaScript/TypeScript part 2 New
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
While I am moving onto working on the Capcom platinum titles logic for the webpage, I will also move onto part 2 of Python vs JavaScript/TypeScript.

Once again, the programming language A vs programming language B is pointless if you look at it as, "which is better". In part 1 you have learned that a programming language is just a way for humans to write human readable code which is then compiled into machine code where the computer reads it as a set of instructions to execute something.

COMPILERS

...That is a simplified way of explaining it, there are a number of ways that a compiler works. There is AOT (Ahead of time compilation) where the compiler takes your source code and then creates an executable file to run your code. The exe file contains binary code for the machine to run the file. You can send the exe file to someone else, and they can run your program on their computer without needing the source code as long as their computer can also read the machine code. Depending on the compiler you used, you could be creating an executable file which needs a particular operating system for the machine code to be read. Or the compiler creates an executable file that depends on hardware architecture to be able to read it e.g., x86, ARM.

Do you remember all the console warring in the past when there was drama around the Nintendo Switch using ARM for its CPU architecture while the other home consoles used x86? I've forgotten all the hilarious things around it about why it was a bad thing for Nintendo Switch but the point is that you should have a better understanding now that whatever game engine a developer uses, the compiler for that engine is going to take the source code and turn it into machine code and there are many different output targets, on computers you would need the game to run using Windows, Linux or Mac. On mobile phones it's just Android or iOS, on game consoles... I am assuming the compiler target is by hardware architecture, I could be wrong, oh well.

Anyway, that is AOT compilation. Then there are programming languages that don't use AOT compilers, such as JavaScript and Python. Python is an interpreted programming language and JavaScript was also that but now the web browsers using JavaScript have switched to JIT (Just-In-Time) compilation. I am not going to bother explaining JIT because it is more complicated than saying: the compiler reads the source code and compiles it into machine code on runtime.

In an interpreted programming language like Python, you create a Python file to just code: print("Hello World") and you run that code. The interpreter takes your source code, reads each line and interprets what your instructions are, it does not compile your code into machine code, this happens during runtime as in when it is running the code. Your terminal should then output Hello World on the screen. So compared to AOT compilation, there is no compiler step, you do not need to create an exe file every time you want to run something. If we typed printf("Hello World") instead and gave that to the interpreter, the interpreter would read it during runtime and then it would stop the runtime and tell you on its terminal that there is a syntax error. While print() is the correct syntax in Python to print something, printf() is not syntax used in Python however it is the syntax used for another programming language.

Why don't all programming languages use an interpreter? 1) It runs slower compared to AOT compiled code, 2) To run the code the interpreter has to be the correct version or later to be compatible with the source code, e.g. You wouldn't be able to run version 3 Python code on a version 2 Python interpreter. Likewise, you wouldn't be able to run the newest JavaScript code on an old web browser.
Should you be using programming languages that use AOT compilers? If you are building programs where performance is hardware dependent as an example.

Despite Python running slower vs other programming languages, it is still one of the most popular programming languages in use.

TYPES

Moving on from the compiler onto the programming language itself, there are characteristics of each programming language which separate one from the other. The main one being the Type system of that language.

What is a type? Think of giving a computer a set of instructions to run your code which says print(2 + 2), how is it supposed to know that you want to add two numbers together? How does it actually know that the characters you've given it are numbers? That's where types come in.

There are three basic types for you to know, they're usually defined as primitive types. You have: Number type (Yes, I know JavaScript doesn't use Int or Float for types), String type (any characters surrounded by "") and Boolean type (True or False).

When you try to add a number with a string... you usually end up with the terminal giving you a Type Error when you run the code. This is where Weak vs Strong typed programming languages comes in. Python is a Strongly typed programming language, JavaScript is a weakly Typed programming language. What does this mean? There's an arbitrary set of rules in each programming language that decides what you can do with different types of things.

For example, in Python. If I tell Python that the variable x = 1 + "2" where 1 is a number and "2" is a string, I then tell it to print(x), what will happen? Python will run the code and then give a Type Error saying that adding an integer to a string is not a supported operand type.

However, if I did this in JavaScript in a web browser console: var x = 1 + "2", it would return "12". It added a number to a string and returned a string.

Another example, in Python if I tell it: x = 5 * "hello", and print x, it will print "hello" five times: hellohellohellohellohello. If I do the exact same thing in JavaScript, it will return NaN which means Not a Number. However, if in JavaScript I do x = 5 * "2" and print that, it will return 10 as a number.

Once again, Python is a Strongly Typed language, JavaScript is weakly typed. JavaScript has implicit typing going on where if you give it two things of a different type, it will try to make sense of it by changing the types depending on the operator used, as you saw, adding a number and string returns a string but multiplying them returns a number, I don't know why it works like that but it is suggested you don't use implicit typing otherwise it becomes difficult to fix your code when bugs occur.

The next part I have to compare JavaScript to TypeScript, TypeScript is a programming language that is a superset of JavaScript. That means anything you know in JavaScript can be applied in TypeScript. What sets them apart is types, JavaScript is a Dynamic weakly typed language, TypeScript is a Static strongly typed language. To simplify this, a dynamically typed language checks for types during runtime. A statically typed language checks for types during compile time/before runtime.

What does this mean? You are more likely to get a type error on JavaScript when running code than TypeScript because TypeScript will not let you compile to JavaScript to run the code if it detects any type errors in your code before you run it.

Since TypeScript is a superset of JavaScript, you are still allowed to type var x = 1 + "2" and print it and it will say "12". However, if you type var x: number = 1 + "2" you will get a type error because you have declared that the variable x is a number but 1 + "2" will return a string which is not what you declared. TypeScript features type inference so when you are typing out var y = 1 + 2 where all the numbers are of the number type, it will infer that the output is a number. This is useful because I would hate having to type out the type of every variable that is of a primitive type.

TypeScript is harder to learn than JavaScript, but because it can detect those type errors before you run any code, it is very useful for catching bugs before you run anything.

Python vs JavaScript

You're a beginner and you're asking... "Is GreatSword good for beginners?", in a sense, learning programming languages is a lot like adapting to different weapons in Monster Hunter. Some are easy to learn... some are hard to learn but the outcome is that you should be able to find what you enjoy.

Most experienced programmers out there will tell you to either learn Python or JavaScript because they're good for beginners. What you should aim for is an understanding and mastery of the language if you enjoy using it so that if you decide to learn another language you are still able to transfer skills that you have learned.

One thing I should mention is that if you look up online what JavaScript is and whether you should learn it, keep in mind that any information saying that JavaScript is a programming language for web applications is an outdated description. JavaScript is being used in anything and everything, you can use it to create apps on phones using React Native, there is a framework for building desktop applications using JavaScript called Electron. I am way more knowledgeable now about programming than I was years ago, if I could go back to when I was deciding between Java or JavaScript to self-learn, I would have picked JavaScript the second time around. If I was aware of Python back then? I would have gone with that.

Python is a general-purpose programming language with popular use for machine learning and data science but, that hasn't stopped it from being used for the back-end in web development, note that you can use JavaScript in back-end web development as well and, now with Web Assembly having appeared it is now possible to use any programming language for web development as long as you compile it to Web Assembly byte code. See Blazor for example which allows you to use C# code in your front-end web applications.

Considering that I have used both Python and JavaScript extensively, what do I prefer? Python is honestly simpler to learn but, with the webpage I am making, I would not want to have made it in Python if that was a possibility. Python is popular and everyone has their own criticisms of it, my criticism of Python is that the use of whitespace which affects the structure of the code such as indentation to indicate different blocks of code can really come back to bite you if you accidentally backspace/tab somewhere.

To demonstrate this, here are two images of Python code:
nin1_1.png

nin2_1.png


This is from the Python code for the Nintendo earnings data, in both images are code that runs and both of them work with no errors. The problem is that one of them has a bug and is running with no errors, the bug is that it was not printing anything. What was the cause of the bug? An accidental tab on line 1253 caused the return statement to be in the same block of code as the if statement. The issue is that whitespace is invisible and affects how code runs, so when something isn't working, you now have to account for the possibility that something is in the wrong block of code.

I have run into that problem twice now; this is why I am preferring TypeScript over Python (I am preferring TypeScript over JavaScript as well). JavaScript/Typescript use the C programming language style of code blocks where a block of code is wrapped in curly braces { } and, a semi-colon ; indicates the end of a line of code. (Of course, you don't need to use semi-colons in JavaScript/TypeScript but the { } are needed to define a block of code inside an if statement or function for example.)

This preference ends up affecting what other programming languages I would learn in the future and, this is without bringing up object-orientated programming and functional programming since most programming languages are adapting by having multiple programming paradigms.

Lastly, why did I spend hours typing this all up? If you are going to change careers into something that is programming related and you didn't end up getting a computer science degree, it still helps for you to learn the fundamentals of how all this works as a system (which you can do with free online resources) because problem-solving is the skill thrown around a lot for skills needed in programming, you are not going to be able to problem solve if you cannot understand the problem itself. An example of this is understanding errors that pop-up in the terminal in Python or console in JavaScript when you run something, you are going to run into lots of bugs and if you cannot understand the error it tells you such as Type Error, then you are going to take much longer figuring out how to fix the problem.

That's the end of the Python vs JavaScript posts.
 
Webpage update, capcom platinum titles file complete, Sega page opened. New
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
This is the latest update.

You will notice now when you are at the home page of my webpage, it is now not as blank as it used to be. I have added a status section to it so now when you visit the page, you will at least know what the latest update is.

The capcom platinum titles file has been completed and I have added the platinum titles for FY3/22 and first quarter of FY3/23 in the capcom section. There is going to be one difference you will see on my webpage compared to the python code I used for the capcom platinum titles threads. If you remember I put up tables that are one of two things, all titles or the titles that sold units during the FY. In the python code both those tables have the titles sorted by the LTD figure, in the webpage only All titles are sorted by the LTD figure while the FY titles are sorted by how much they sold during the FY hence you will see they have different ranks in each category.

I have also opened up a Sega page. I am planning what to do next.

That is all for the latest update.
 
Webpage update, sega series IP file complete. Bandai Namco page opened. New
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
This is the latest update.

The Sega series IP file is complete. Series IP data from the Annual Reports from FY3/13 to FY3/21 is viewable on the webpage. Yes, you will notice that some IPs have NaN in their YoY numbers... NaN means Not a Number. I just didn't get around to fixing that yet. The -Infinity% you will see on one of them is accurate.

I have also opened up a Bandai Namco page. I am planning what to do next.

That is all for the latest update.
 
webpage update, bandai namco file complete. Updated calendar. New
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
This is the latest update.

The Bandai Namco series IP file is complete. Series IP data from Bandai Namco's fact books from FY3/19 to FY3/21 is viewable on the webpage. I have still not fixed the NaN issue with the Sega series IP data mentioned before.

I am not opening up any new company pages at this time. I plan to refactor my code first to improve things and then I'll see what I do from there.

I do not plan on adding every company out there, for example it would be easy to do that if I posted consolidated earnings for every company, but it is a fact that nobody cares about how much money X company makes. If X company is not posting data about how many units their games have sold, then no one is going to care. What is the basis for that? From seeing the number of views of earnings release threads in the past for third-party developers.

That is why I chose companies where even if it was just yearly (like Sega and Bandai Namco), I could at least get data about their IP. I don't want to waste time with companies that are very inconsistent about presenting their software data in their earnings releases and annual reports.

Just to note, as you may have noticed it has been roughly 1.5 months since I first posted the thread here, so it has taken that much time building this webpage.

The events page has been updated with dates for some companies having earnings releases coming up. Once again, I am not going to put up the dates of every game company. There are other users out there with much larger calendars for a larger number of gaming companies such as from https://twitter.com/DomsPlaying on Twitter who has this calendar on his webpage (linking to a past calendar): https://workingcasual.com/earnings-calendar-jul-aug-2022-gaming-media-tech-companies/

That is all for the latest update.
 
small webpage update. Imperative vs Declarative programming paradigms New
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
This is the latest update.

I have changed the messages that appear at the top of the page in each section. Instead of the message expanding to the sides from the centre, it now scrolls to the right from the left side like video game text scrolling. It's not that smooth though, and it doesn't look on screens not wide enough. Edit: This looked very crap on mobile so I had to change it back however, I have made it that when you go to each platform section the scrolling message is now like the code data so you can change the background colour of it while the message is generating.

Other than that, I have fixed the NaN issue in the Sega Series IP data. The NaN issue occurs when you are doing zero divided by zero.

I have added the date for Capcom's next earnings release on the calendar. To note, these are the other companies I am waiting to add onto the calendar but there is always the possibility that I may not add them in time:
Microsoft, DeNA, Koei Tecmo, GungHo, Square Enix, Sega Sammy, Konami, Activision Blizzard, Take-Two, GREE, Bandai Namco, Kadokawa, NIS. If I don't add them, you can just check their IR calendars on their official websites.

The next topic is programming paradigms, I would rather just keep it as simple as possible explaining this because I haven't spent much time reading on the technical details. A programming paradigm is a way of classifying the characteristics of a programming language.

One way I have seen people describe Imperative compared to Declarative programming is that Imperative programming is concerned with the "How" of telling the computer to do things vs Declarative programming where you tell the computer "What" to do. Another analogy is Imperative = Having to follow steps for how to bake a cake, Declarative = Here's the ingredients computer, bake me a cake.

The point of this is, as I've mentioned before, I am having to go and refactor my code until I think I cannot improve it any further. The only thing stopping me improving things any further is not having better knowledge of programming paradigms.

Procedural programming and Object-Oriented Programming are linked with Imperative Programming as they deal with the state of the program that's being used. A procedural programming language would be C while an OOP language would be Smalltalk.

Meanwhile the Functional programming paradigm is linked with Declarative programming, a purely functional programming language would be Haskell.

This doesn't mean there can't be multi-paradigm programming languages, currently a lot of OOP languages added features that are based on functional programming.

With popular programming languages having features for multiple programming paradigms, this can help improve your problem-solving skills if you choose to deep dive into those paradigms and learn the methods available as they will give you new ways of how to code.

However, with some programming languages being all-rounded covering different paradigms, it doesn't automatically make them better than programming languages that cover a single paradigm because there may still be differences. For example, JavaScript has a Sort function which can sort a list of values, the issue if you are programming in a Functional Programming style, you would want to be avoiding mutating variables outside of functions. To get around that you would have to create a new array using map and then sort through the array so that the original variable doesn't get mutated.

There's not much more I can say since this is still surface-level details. The easier thing to do is to demonstrate Fizz Buzz in an imperative style and then in a functional programming style.

For those new to programming, FizzBuzz comes up in algorithm questions. This video is a good example of why you have to learn data structures and algorithms:

Regardless of whether you watched the video above. Here is FizzBuzz in an imperative programming style written in JavaScript:
pain74.jpg


At line 7 I have created an anonymous function that takes in an array as a parameter and assigned it to the variable FizzBuzz. At line 9, I create a for loop which will start from 0 and loop until it gets to the end of the array length. At line 10 we create a variable called elem that contains the value from an index of the array. From line 12 to 20, I get that value and am compare it to the values 3 and 5 by using a remainder operator (%) to check if elem is a multiple of that number e.g., 9 is a multiple of 3 therefore at line 15 the computer will print to the screen Fizz. If any number isn't Fizz or Buzz or both then it just prints the number to the screen on line 19.

While this is a simple algorithm to solve. If it was asked in an interview question, the interviewer would probably ask you how you would deal with the problem if more conditions were added e.g., you get asked to print Bazz if the number is a multiple of 7.

It is simple to add that, but the issue is you are being assessed on how you would deal with something that is going to increase in scale. While FizzBuzz isn't a complex algorithm, if you had much more complex algorithms to deal with that use up much more lines of code for each condition, then while your code would still work, it would be very difficult to maintain as it keeps increasing in scale.

So here is the solution that I came up with for a scaling FizzBuzz in a functional programming style written in TypeScript:
pain70.jpg


Starting from line 1: we have our anonymous function assigned to the variable fizzBuzz again. I changed the parameter name to index which is of type number. At line 2 I have an output variable which is a blank string, this string will be mutated to contain whatever it needs to say that isn't a number such as Fizz. At line 4 is a function inside the function which I have called helper. The parameter it takes is called tuple and uses a tuple of length 2 that contains a string and a number. Note: A tuple is an array (or list) that is of a fixed length where its values can be of different types. At line 5 I create a new variable that does array destructuring, this is a method of extracting values from an array and storing them into separate variables. The string type value is stored in str and the number type value is stored in num.

At line 7 the if statement should be familiar to you, it is taking the index number and seeing if it is a multiple of the num value. If the condition is true, then it is going to concatenate (add) str to the output variable and then return nothing to exit the function. If false, then it just returns nothing.

At line 14 we have a return statement which actually calls an anonymous function, the parameter is called list which is almost the same type as that tuple except it's an array of tuple (or list of tuples). At line 15 we take the list and use map; map is a declarative expression where you give it an array and then it does something to that array (iterate through it) and then it returns a new array that is of the same length as the array it was given. So in this case, what I am telling list.map to do is to iterate through each index of list (which each value of index is a tuple) and to use that tuple as a parameter for the helper function. It goes through calling the helper function for each tuple in the list until it reaches the end.

So here is where you can see a difference between using a for loop (imperative) and map (declarative). They are both for iterating through something but as you can see when looking at map, it just looks like there is no steps for how to do something, I am just telling the computer, "Map this" and that's it. I've told it what to do whereas in a for loop I had to give instructions for how it needs to loop, e.g., having to tell it how many times it needs to loop. Map will automatically go through each element of an array but with a for loop you have to tell it how far you want to go through an array.

At line 17 there is a return statement that contains a ternary operator. This is a kind of if else statement. The condition is checking whether the value of output is false (indicated by the ! mark), JavaScript has this thing where it applies true and false to particular values, e.g., 0 is false but 1 is true. Therefore, a blank string is considered false whereas a string that contains any number of characters is considered true. So what happens next is if !output is true, then it returns the number from the index parameter, if !output is false then it will return the value of output.

Now, how did I get this function to work? At line 21, this is the data structure I went with. I created a variable called tupleList which is a type of tuple of length 2 containing a string and a number and is inside a list. As you look at the contents of the list you will see a string and its corresponding number. This data structure is how I deal with the scaling issue of FizzBuzz, not only can it scale up, but it can also scale down. Therefore, I can remove the tuple that contains Bazz, or I can add more tuples to this list and that is all I have to change. It doesn't have an effect on the function therefore this code is very easy to maintain if say I was adding a new tuple every day, all that would happen is the tupleList just gets one line longer each day and no other code would need to be touched.

At line 27 is how I set up a "for loop" but in a different way. I create a variable called x and assign to it an Array.from. The Array keyword allows me to create an array in a similar way that you can create a new Class in OOP. Using the Array.from method I can generate a list of numbers in an array like [1, 2, 3, 4, 5]. On line 27 the {length: 100} is a parameter for telling the Array method that I want to create an Array of length 100, the (v, index) is another two parameters where index means the index number of the array. There are parameters therefore Array.from is a method that uses a callback function. At line 28 what will occur is that the callback function will call the fizzBuzz function (I should mention here that I applied currying and composition to this fizzBuzz function), the first parameter in the fizzBuzz function will be the value of the array index+1, e.g. the array at index 0 contains the value 1. The second parameter of the fizzBuzz function is the whole tupleList.

What will happen is that once that is called, the function will go through the callback function again but with the next index in the array and it repeats until it reaches 100. At line 29 a method is applied on the array called reduce, think of this like the sum recursion function I made using Python (mentioned in another thread). Reduce uses recursion to sum up the elements of an array, it then returns a single value. For example, [1, 2].reduce... I can set an initial value of 0, 0 becomes the accumulator value, reduce does a callback function, it then adds 1 from the array to 0, it then repeats this step with 2, what's 0 + 1 + 2? The value returned becomes 3 of type number and it is no longer inside an array. However, this is a little different. Since I am concatenating values that are strings or numbers to a string, I have taken advantage of how JavaScript works when you add a number to a string, JavaScript will implicitly convert a number type value to a string type value when it is added to a string. This is seen line 29 where it says acc + "\n" + next. "\n" is the command for creating a new line so that each next value will appear on a new line instead of appearing on the same line. Every next that is a number type will be added to "\n" and hence the type from the value in next will be converted into a string if it isn't already one.

That was a lot to explain... so when it completes all of that, it returns the value and is assigned to the variable x. I then console.log x which will print all the values that went through fizzBuzz from 1 to 100 and it works.

Why did I not put the console.log inside the fizzBuzz function itself? That is due to the functional programming style. A pure function is a function that just takes an input and returns a value, and that value is expected to be the same no matter how many times you run it. A function is not pure if it contains side effects, a console.log is a side effect because it does not return a value hence you put the console.log outside the function. Another side effect is mutating variables, you might remember the output variable in the fizzBuzz function, that variable gets mutated, but it is not a side effect of the function because the return value of the function is the same every time. The kind of mutation that is a side effect though is a function that mutates a variable that is outside in the global scope. Functions have a local scope, variables outside of a function are in the global scope and if they mutate via a side effect i.e., change value and/or type. Then, it may lead to bugs down the line that can be hard to track. That is why creating pure functions are a fundamental aspect of functional programming because you will know that what changes only occurs inside the function's local scope so that makes it easier to find a bug in something that could be 20 lines of code compared to a bug from a global variable that is in one million lines of code that you have to find.

I did not get to explain other functional programming methods such as higher-order functions, closures, partial application, currying and composition. It doesn't matter since there's plenty of resources out there to learn it. The point is that with the scaling FizzBuzz that I made, that still took time to make from having to learn those methods mentioned above and applying it to FizzBuzz made it easy to test and understand how stuff like currying works.

That is all for the latest update.
 
Last edited:
Top Bottom