• Install Base's 1-year anniversary - Let's talk and celebrate!

    Check out the thread here!

  • Manga Sales | Discussion Thread

    We have created a thread to talk about manga sales. 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.
 
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
I wanted to make this post days later but I'm just really impassioned right now. Once you have finished reading this post and if this has really inspired you then you can click on the thanks button of this post.

I've already forgotten what I wanted to say because there was so much to think about to write.

The easiest starting point is talking about myself and then going from there.

Some of the decisions I've made in my life so far were not favourable as they resulted in lost time with no better outcome. I'm sure some of you reading this understand that there is only so much time we have left in this world, unless you have already gotten to the point you wanted to be at in life then you should have no care in the world however, I'm certain that many people are not at that point.

When you have gotten to the point I have where you give up on your ambitions and you change slowly over time as a result of that, you will forget who you were and you will go through letting each day pass by and soon enough it will become years passing by like the days do. Is this the outcome you really wanted?

I'm sure everyone will have that moment in their life where an event occurs that will change who they want to become. You don't know the shit I had to go through to finally reach that point, because of that, not only am I going to become who I used to be... I am going to become even greater than that. I have awakened to my determination, my determination... runs so deep that nothing is going to get in the way of my ambitions!

What have I done so far to become who I used to be? I used to be very fit, my ambitions were the reason I was so athletic and when I gave up on my ambitions I no longer cared about my health and gradually over time I added over 30kg+ to my weight to end up becoming obese. Over the last year I did change my diet to avoid the things that were contributing to weight gain and did exercising at home such that I would lose around 10kg over time but, then I would screw up here and there and eat things I shouldn't be eating, the weight gain was slowly creeping up and I wasn't bothering to exercise. So what would happen is people thinking I'm on the equivalent of a yo-yo diet because I put back on all the weight that I had dropped however, each time I tried again after putting back on the weight I adapted by noting what didn't work and what I needed to change. For example, cheat days don't work, they're dumb and they will make you get into the habit of screwing up your diet every other day of the week.

What else did I do to make myself lose more weight each day? Once I got to the point that I could not improve my diet any further which by the way is my permanent diet so don't waste time telling me that if I go back to what I used to eat then I will put the weight back on because I know. To increase the weight loss rate I had to add more repetitions and sets to my exercises and eventually even added new exercises, I do not have any gym equipment so it is very cheap and easy to just do exercises that require your body and gravity. Yes, I have Ring Fit Adventure but I did not even use it for this.

On my third attempt of losing weight, using all the knowledge I have accumulated thus far, not only did I drop weight at the fastest rate yet but I was determined enough to make sure it didn't go back up as it has before. I have not reached the weight I want to be at yet but I know now it's never going to go back up like it used to. I am very close to getting to the last 10kg remaining to lose to become who I used to be.

What is the point of all this? I do not want you thinking that this is about weight loss, this is about ambition. I have given you an example of an ambition and I am telling you what is needed to get there:
S.C.A.L.E. - Small changes accumulate large effects. Get that acronym in your head, I gave up on all my ambitions and slowly I ended up putting on over 30kg+ with no effort over years. I created new ambitions and had to put in a lot of effort just to get rid of almost 2/3 of that weight gain over two months.

Was that effort worth it? Yes. You make small changes daily until you have figured out what you need to do, you keep applying those changes each day and it will accumulate over time and you will see results continuously.

When I wake up each day, I weigh myself and then compare the weight to the previous day and then note if what I did the previous day affected this positively or negatively and then I evaluate what I need to do next time if I did something that wasn't the outcome I wanted. I then eat the food specific to my diet and then I do my exercise routines which go for around one hour so yes, I have to get up early enough to get time to exercise before work. I then have to spend the rest of the day avoiding screwing up my diet and, as long as I don't screw anything up, my weight is guaranteed to be less tomorrow than today. Your rate of weight loss will vary from day to day, I can easily drop 1.5kg in a day if I ate a lot on the previous days but afterwards it will slow down a lot which was why I had to increase my exercise a lot to drop 500g per day at most when I was being consistent with my diet. Don't get discouraged if you're not dropping as much weight as you like, don't be impatient, as long you are sticking with your daily plan and you are still seeing weight loss per day then you will slowly change just as much as you did the other way around.

I'm sure by now that some of you will recognise a pattern and if you have read or seen anything by James Clear then yes, I am applying some of his concepts such as identity-based habits (who you want to become) and the aggregation of marginal gains. I want to make something clear (pardon the pun), I only ever saw a video about him doing a presentation where he talks about his concepts but when I saw that video earlier this year, I noticed that the things he talked about were things I was already applying such as getting into the habit of my changed diet and exercise. I never read any of his books but if you want to know the book related to that video it is called Atomic Habits.

So when I talk about S.C.A.L.E. that's my version of the aggregation of marginal gains. When I talk about who I want to become, that does refer to identity-based habits, when I talk about ambitions, that is a fancier way of saying goals.

Is weight loss the only ambition I've had? No. As you can see from this thread I am building my own webpage, I didn't get there from nothing in an instant. What am I currently doing as an ambition? I am building my programming skills to change careers and to get out of being stuck in shitty low wage jobs. When did I start this ambition? At the beginning of this year before I even saw that video I mentioned. Was I being proactive when I decided to make this ambition? No, it only happened when I decided that I didn't want to be stuck in my current job.

Since the beginning of the year I have been spending all my spare time every day to build my skills and to improve my coding, this meant no time for video games. I was going to make sure that I will be getting out of my job this year. If you know how to use GitHub and if you know how the URL in the webpage has my username then you can view my profile to take a look at all the things I've made over time. Did I do anything else that S.C.A.L.E. would apply to my programming skills? Yes, at the beginning of the year my touch-typing was rusty and I had gotten annoyed with using the QWERTY keyboard layout so I first went to learn Colemak using the websites: keybr.com and monkeytype.com. Colemak is pretty easy to lean into since it shares a lot of keys with QWERTY but moves a lot of commonly used keys into the home row, the issue was that after a week of learning Colemak each day and getting to like 40 words per minute I noticed that I didn't like having to press keys positioned where T, Y, G, H, B and N are on the keyboard. So I tried using the Colemak mods but those didn't solve the whole issue I was having so I eventually went to a keyboard layout that makes strong use of all your fingers including the pinky fingers and it doesn't have letters positioned on the T, Y, G, H, B, N keys mentioned. That keyboard layout I am using now where I first started out at 7 words per minute and the only common key it has with QWERTY is the X key, that keyboard layout is called Engram. I am still using the Engram keyboard layout since starting in the beginning of the year and I can type at 65-70 words per minute on average. What am I doing to get faster at coding other than typing speed? A couple of weeks ago I have started to use Vim and after doing the vim tutor exercise just once I have been coding way faster with just using the keyboard than I would with a keyboard and mouse and yet I need to practice more and know more of the commands to get even better. That should be enough examples for you to understand that I went from someone that used QWERTY for many years to suddenly using the Engram keyboard layout where I am relying on muscle memory because the letters printed on the keyboard are still in QWERTY.

Am I finally going to get to talk about what I wanted to say?

First, because this webpage I am building has been so much work. It would be a complete waste if I do not update it as soon as possible after every earnings release. That means I am not going to wait a year to update it, when the next Nintendo earnings release comes out, I will first post the tables as usual on Install Base and then once I find that I have made no errors I will then update my webpage and tweet about it so that people will notice it and go to my webpage which as a reminder still contains links telling people to visit Install Base. Remember what I wrote in the thread about My advice on small details regarding Financial Results threads. What I was doing making earnings results threads was having enough of an influence for others to start using fiscal years when reporting earnings releases and even some people plagiarized my code output. Just as I am continuously building my programming skills, I want to keep building my webpage to have newer features and new details so that I can see what effects will occur over time. I am still going to make it a front-end only webpage and I know how niche video game companies earning data is so I am not expecting it to make me money so it will still just be a page hosted on GitHub so I am going to take advantage of the free hosting.

So I think I can finally talk now about the scale of ambitions. When you lose weight it can take months to see a desirable result but when you have even greater ambitions the time it can take and the effort, planning, depth and complexity can increase significantly. Using my programming as an example, I am using a different keyboard layout, I am reducing the usage of a mouse, I have gone from using Python to learning HTML, CSS, JavaScript, REST APIs, GraphQL, MySQL, MongoDB, programming paradigms, the MERN stack, MVC, etc... to build all the skills necessary just to change careers. All those things accumulated slowly over time, so much has changed since the beginning of the year for me and I know I am already ready to change careers yet I am still wanting to refine my skills which is why I am learning TypeScript right now before I even bother applying for any jobs.

This continuous cycle of improvement is the feedback loop of S.C.A.L.E., you create an ambition, you make small changes, you keep applying them over time, you see results, you then find ways to improve on those changes, you then apply the new changes, you then get even better results than before and the cycle repeats until you cannot refine it even further and then, if you choose to, find a new ambition that will make you go even further beyond.

You have so many years to create an ambition, get started on it, figure out how to get the outcome you want, keep working on it daily, see results over time, improve on it or even make a new ambition to increase the scale of want you want to do.

Depending on the scale of the ambition, it could take years to achieve the desired outcome... which is why I wanted to bring up Install Base. Remember in the thread I made about advice on small details in financial threads I said, "...And hey, maybe in the future someone will find this forum so valuable that they'll buy it for $1B." I don't know if someone would ever buy it as it is right now for $1B but there are so many things Install Base could do to grow as company even if the ambition isn't "Get someone to buy Install Base for one billion dollars!". Install Base is a company and if it finds ways to make money it can grow, and depending on the direction of the company it can create ambitions like, "Open up an indie game publishing division" or, "Acquire Media Create". The last one is obviously more ambitious and I know things are very simplified because it's not that simple but, the potential is limitless to make Install Base more than just a forum, you can sell it off if you want for more than $4.5 million if you do something ambitious.

If you do not want Install Base to become something bigger that's fine. It would require a lot of time and investment and would require people who would leave their current jobs to get time to work on Install Base full-time and having to make the company profitable. So it would require very careful planning to slowly accumulate more money until there is a business model that makes your annual profit grow so that you can find new ambitions to make the company become even bigger.

It's great to have ambitions but they still have to be grounded in reality however, there is nothing stopping you from doing what it takes. Even if you decide to put an end to an ambition because something has happened where you think it's no longer achievable, that doesn't mean you didn't change. You surely did something to change and you can still take what you learned and apply it to a new ambition.

Don't let the days pass by into years for you to finally make that change.
 
webpage update, Worldwide Hardware/Software units file complete. Python vs JavaScript/TypeScript Part 1
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.
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.
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
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.
 

Cantaim

Member
The coding discussion has been a fun read thank you! Felt like I was back in college again learning about it for the first time lol
 
Webpage update, capcom platinum titles file complete, Sega page opened.
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.
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.
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
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:
calendar updated for 20 of 22 companies, a reminder how it works.
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
I have updated the calendar that the only companies I do not have dates for their earnings releases are Square Enix and NIS. I may not bother updating the dates for those two companies, the main reason I don't bother regarding Square Enix is that consistently I never know when their earnings release date is because I have never seen an exact date given for their earnings release on their IR prior to it happening. All that you can know is that it will happen sometime during November so expect the date to be a surprise.

A reminder that the calendar is in the Events section of my webpage, when you click on the dates for it will show the time zone relative to that date. The dates are NOT relative to where you live, they are relative to where the headquarters of the company is located. I am not putting in times for when the earnings release could occur because it would only be an estimate, for example most Japanese earnings releases occur after the Tokyo Stock Exchange is closed for the day but in the US, there are US companies that do their earnings releases while the NYSE or NASDAQ are open so there is no consistency for when a company decides to do their earnings release.

Each company on the calendar has a link to their IR page for your convenience.

That is all for the latest update.

Here is a refactor of the scaling FizzBuzz posted before but in two versions, both use recursion rather than a loop to do FizzBuzz, the main difference is the order of the output.

This version outputs from Max to Min value:
pain75.jpg

pain76.jpg


This version outputs from Min to Max value:
pain77.jpg

pain78.jpg


Take a look at the second version that outputs from the minimum value first to the max value. Start from Line 56 and you will see I am using currying which is the process of taking a multi-parameter function and splitting it up into single arguments. I did wonder what was the point of currying but, there were a couple of things I noticed. In line 56 I am assigning fizzBuzz(tupleList) to the constant maxValue. maxValue is still highlighted as a function, I changed the order of the parameters to use tupleList in the first argument because the argument tupleList is a constant parameter and doesn't require the user to change the function argument to say... tupleList2.

At line 57 I create a variable called result, result is of type String while maxValue is of type Function. At the right-hand side of result you will see that maxValue is being called with parameter (15), this means I am calling the function to run through numbers 1 to 15 doing fizzBuzz. With currying, if I made multiple result variables such as "result2 = maxValue(30)" then you will notice that I do not need to set the first argument of fizzBuzz which is tupleList again because it has already been set.

Line 29 is where the function will start when called, you will also see on that line the first argument which is the tupleList. Line 31 is where there is a minimum number as I will need this to actually print out fizzBuzz from 1 to 15 for the result variable.

Line 32 is the second argument of the fizzBuzz function which is created by using an anonymous function otherwise also known as a lambda expression which you'll recognise from one of the patterns it does: (x => x) aka (input => output). The return statement is going to return a function that will take a number as the input and give a string as the output hence "return (number): string => {...}".

Since this has been refactored to use recursion, this is where it's going to get interesting. At line 33 is the if condition that will exit the recursion and return the string that will go to the variable result. While it is not hitting that condition it will go through the process of what I already said before in the last post of checking whether a number is Fizz, Buzz, FizzBuzz, Bazz, etc.

At line 47 there is a ternary operator (an if else statement) where if output is a falsy value i.e. "" then it will it get the minValue which is 1 for example and it will turn the number into a string and then concatenate it to total and create a new line so that the next value doesn't appear on the same line. Else it will concatenate the value of output to total with a new line.

At line 51 minValue++ means incrementing the value of minValue by 1 therefore it goes from 1 to 2 for example.
At line 52 the function will return maxValue(integer) where integer is the value 15, here the integer is constant as I do not need to change the value when calling the function again. Now this is the part where you wonder, "You're calling the function again, isn't it just going to start from line 29 which means the value of minValue will be reset to 1 instead of being at 2 or higher and total will be "" again?". The surprising thing is no, calling maxValue inside the lambda expression to do recursion doesn't reset the whole thing. I can't explain why it works but it works so that's awesome. The important reason for getting the recursion to work like this is so that the variables total and minValue are kept in a local scope which means they're inside the function while their values are being mutated. This is important because if the values are being mutated inside a function, then you know the values will reset to their default once the whole function scope has been exited. The issue was that if I could not do that then I would have to have global variables being mutated which is not great because it can be hard to track their state i.e., what their current value is. Thanks to the use of closure, I could use varying levels of a local scope where the inner block of a scope accesses the data of the outer block inside a function.

Lastly, line 58 is printing the result which gives the other images shown of what the output looks like.
 
webpage update, games section added.
OP
OP
ggx2ac

ggx2ac

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

There is a games section on the webpage.

When you click on it, a game will appear.

There are two ways to control the character, by using the directional buttons you see on the screen or by pressing the arrow keys on your keyboard.

I forgot to mention on the page that you can use the arrow keys on your keyboard since it's much easier controlling the character that way.

Every time you get in the same square as the opponent, you deal damage to the opponent. The opponent will deal damage to you the same way when they move to your position. (Also, every movement where you don't change to a different position can also deal damage if you and the opponent are in the same space i.e., moving against the walls)

I didn't want to make things unfair for the CPU, so for every time you do one move, the CPU will move three times. That means the opponent could hit you up to three times for every time you hit once.

This wasn't what I had in mind for the game I was thinking of making so I just got something out as soon as it was working decently.

That is all for the latest update.
 
webpage update, using Vite, compiling to ES6.
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
This update only really affects you if you are an Internet Explorer user.

The webpage has been updated and is now compiling to ES6 from using Vite.

I have refactored my code to use Vite, what does that mean?
When making the site originally, I used Create-React-App which is something that was used to make React applications much easier to setup. One of the big downsides is how much stuff it downloads to set it up and another was pushing updates to the website since it's hosted on GitHub pages.

Vite is Frontend tooling for your developer environment. It's not used just for React, you can use it for "Vanilla" JavaScript among other UI libraries like Vue and Svelte. When I am using Vite, it feels like it also runs things much faster than when I used Create-React-App and it is so much easier now deploying the latest build to GitHub Pages.

How do you pronounce Vite? You would remember that "Vita means life", Vite means quick. Vite is basically saying Vita but with the "a" being silent.

What happens to the Internet Explorer users?
They might not be able to view my webpage, when you are making a webpage that uses JavaScript, you might remember that the JavaScript interpreter is inside the web browser. The interpreter can only understand what it knows. For example, a Python version 2 interpreter will not be able to interpret Python version 3 code. That's the same issue with web browsers when people don't (or can't) update the web browser they use.

To be able to cater to as much people as possible, there are configurations you can set such as the compilation target for the JavaScript code. Before, I was targeting ES5 which is ECMAScript from 2009. Now, it is targeting ES6 which is from 2015. What this means is, when my code compiles from TypeScript, it gets converted to code that would work on browsers that only know up to ES6 and nothing newer.

Yes, Internet Explorer did get officially retired but that doesn't mean it's no longer used.

Are there benefits to compiling to the latest version of ECMAScript? Yes, it can result in better performance and smaller file sizes when compared to an older version of ECMAScript. Whether it's worth it depends on the use case.

Is it possible to make Vite compile to ES5? Yes, but it requires adding some plug-ins so to actually implement that for the site to work on very old web browsers which is not worth the effort.

So, the point of Vite is to have a better developer experience compared to using Create-React-App. Yes, there are other alternatives such as Next.js which is a React Framework but that is more suited to making full-stack web apps rather than Frontend only stuff.

That is all for the latest update.

Edit: Try going onto websites from your 3DS, Vita, Wii U or Wii and you can see then if they work.
 
webpage update, 2nd game added.
OP
OP
ggx2ac

ggx2ac

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

I have added another game to the games page. I was trying to make a clone of the Game & Watch game: Fire. Then issues occurred with trying to get this to scale, so you only get one object to move along the stage. So obviously the only way to make it challenging is to increase the speed.

I will need to figure out how to manage multiple objects on screen at once before I make another game.

That is all for the latest update.
 
webpage update, capcom game series data added.
OP
OP
ggx2ac

ggx2ac

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

I went through the Wayback machine and got what data I could from Capcom's game series sales data. I didn't want to get the data for each quarter, so I chose to use the data at the end of each fiscal year similar to the data you see for Sega and Bandai Namco.

So now you can see data for Capcom's Game Series sales from FY3/2010 to FY3/2022.

A reminder about something I've talked about before for how Capcom rounds down their figures:
If a Game Series such as Ghosts n' Goblins doesn't reach 10M units, you will see that Capcom rounds down the figures for it by 100k. So, for example you can see it go from 4.1M units to 4.2M units. It only has to sell 100k units for you to see an update. However, the moment Ghosts n' Goblins reaches 10M units, Capcom rounds down the figure by 1M. That means it has to go from 10M units to 11M units for a visible update in its sales figures. Take a look through the data and you'll see clearly with Game Series like Resident Evil.

That is all for the latest update.

I am still having to refactor code; you may remember that I showed here a scaling FizzBuzz. Did I even get to make use of that in my code? Yes. Even though what I applied is not exactly the same, the fact that I made that scaling FizzBuzz made me think differently for having to deal with some code.

Here is some old code for how one of the components for a Capcom fiscal year looked like:
pain99.jpg


And this is what it looks like after being refactored:
pain100.jpg

pain101.jpg


And the output of the component onto the page, left side is old, right side is new:
pain102.jpg


What did I do exactly? In the first picture at line 14 is a useEffect which is a React hook. In there is an if else statement that checks the value from line 9 which uses a useState hook. As you can see from line 15 this if else statement gets larger the more conditions that occur. When a condition is true it will set the data on the useState hook in line 8.

In the second picture, you will notice that the useState hook for [data, setData] is gone because the refactoring I did meant it was no longer needed. At line 20 is a variable called componentList which contains an array of objects. Those objects contain a name and a value.

If you saw the scaling FizzBuzz I posted before, the componentList should be familiar to you. The componentList is just like tupleList I made for the scaling FizzBuzz. This list is what helps with scaling things up or down.

At line 35 is a variable called dataList, this is used for the SegmentedControl component that is part of the output. I moved it from its original location to make it easier to edit.

If you go to the third picture, at Line 37 is selectDataComponent. This is a curried function, the first parameter is using the componentList that was made, the second parameter is going to take the value from the [value, setValue] useState hook and will output a string. At Line 40 the componentList is filtered so that it returns an array that only contains what matches the value from the useState hook, e.g. FY Platinum Titles. Since only one name is expected to match, I then use array destructuring to get the element stored in a variable that is not in an array. At line 42, I then use an if statement on the return statement. If the dataSelected variable isn't undefined, then it will return the value which is a string containing the data for the Capcom Game Series data or the platinum titles data. Else, if dataSelected is undefined then it will return a blank string which means no data is shown. At line 47, you will see that the useEffect hook has less code now that the selectDataComponent function is taking care data retrieval.

Then at the fourth picture, where the old code is on the left side. You will see on line 60 that {data} is used to display the data that was put into the [data, setData] useState hook. For the new code on the right side, you will see that {data} has been replaced with {selectData(value)}, this is the selectDataComponent function taking the value from the [value, setValue] useState hook as it's parameter. The SegmentedControl component is where the value is coming from, that is the component for the set of buttons you click on when you want to see Data Sources, FY Platinum Titles, etc.
 
webpage update, square enix game series New
OP
OP
ggx2ac

ggx2ac

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

Besides the other thread I made where I mention about Sales per Software Unit: https://www.installbaseforum.com/fo...com-bandai-namco-koei-tecmo-square-enix.1160/

Koei Tecmo and Square Enix had been added to the webpage.

Just like some of the other companies, I've grabbed what data I could for Series Sales data for Square Enix (listed in FY Series IP) with data from FY3/2010 to FY3/2022. The majority of the data is just Final Fantasy, Dragon Quest and Tomb Raider.

Note that from FY3/2010 to FY3/2015, the data is very uncertain because no dates are given for the sales numbers. Why did I choose the press releases that are released at the 1st Quarter of the following fiscal year?

Between FY3/2016 to FY3/2019, Square Enix's Annual Reports gives Series Sales data as of June 20XX, when looking at the press releases for those years, the most recent data that is different to the annual report occurs at the 1st Quarter of the following fiscal year. To stay consistent, that same quarter is used for the fiscal years prior to that.

I appreciate the other gaming companies that actually put dates on their data because this was just unmanageable regarding Square Enix.

There is still plenty of data that can be dug up from old Square Enix Annual Reports and Presentation Slides where they used to give detailed sales data of titles including regional data. I will not be doing that at this time.
 
Nintendo Special page removed for now due to issues New
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
While updating the webpage with data for Square Enix FY3/23 data (1st and 2nd quarter), I ran into a new issue. The code is getting so large that things are running before variables are initialized causing the webpage to crash.

I am assuming things will still be fine for tomorrow with the Nintendo earnings results since I can post the tables onto the OP for the thread but for now the Special page will not be active on the webpage until I solve this issue which may require a lot of refactoring.
 
Nintendo Special page now back up on webpage New
OP
OP
ggx2ac

ggx2ac

(They publish Dark Souls)
Member
The issue regarding the Nintendo Special page has been fixed. It wasn't as problematic as I thought, it had nothing to do with issues at large scale, I just forgot that I had prepared data for tomorrow's earnings release but that data was empty so that was what caused the crash.

Other than that, I also fixed a bug that occurs for the charts on the Nintendo earnings data, when you click to view a bar graph and then you click the other button to turn on comparing the dataset to another dataset and then you click the "on" button again to stop comparing two datasets, the single bar graph that appears isn't stacked when it is supposed to be.

Now when you click off it will turn off both the bar graph and the compare to another dataset. This fixes that bug.

I have been trying to fix the issue with how the graphs look small on mobile but what you'll most likely have to do is view them in landscape mode for them to look bigger.
 
webpage update, refactoring to reduce scale New
OP
OP
ggx2ac

ggx2ac

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

There's probably no visible change at all to the webpage right now. I mentioned there's been issues with the scale of this project as it keeps growing with added years of data. Even though I have been modularizing my code and functions, I could still see parts of my code that was just repeating especially where data was hardcoded.

I have just finished refactoring the code for one of the companies, Square Enix.
To show what has changed regarding the scale and how things have been organized, see this image:
pain124.jpg

That is the folder that contains all the data I have so far for Square Enix. Each of those folders contains the annual report numbers or the software sales numbers or both. All the files in each of those folders contain the mostly the same .tsx files to run the functions but with different hardcoded data.

This is what the data folder for Square Enix has changed to:
pain126.jpg


Instead of folders for each FY, each folder is now a category of data that contains years of files. The Data_Sources folder is still a .tsx file because it contains JSX code for the sources of data. While in the Software_Sales folder (not opened) and the Annual_Report folder all the data is now in JSON files. I import the JSON data and use it in either the annual_report_square_enix.tsx file or the software sales equivalent.

Here's what the structure of the JSON files looks like:
pain128.jpg

pain129.jpg


Most people are probably familiar with CSV files, those use column headers followed by rows of values separated by commas. With JSON files, it's easy to use with a webpage since it uses JavaScript. JSON data can have any structure as you can see above, it's similar to making a JavaScript object but with some restrictions. I do not have to stringify/parse this data since it's not being sent from a server. I go to the file where I need to run this JSON file and import it and then I can use it like any other JavaScript object. I get the values needed and create the variables needed before running the functions to produce what you see on the webpage.

That's one part where I reorganized things to reduce the amount of hardcoded data. I put the data into the component which the component goes onto page.

This is what the components look like:
pain125.jpg


Similar to the data folder, I had components for each year of data. The components are imported by the page, it will run one of these components at a time when you enter a correct fiscal year containing data. The issue again is that a lot of code is being repeated and if I have to make a change to one file, it is likely I also need to make that same change to all the other files. This is where another issue of scale is occurring, I am having to make ten changes to ten files when ideally, it would be better to have only one file that changes all those ten things at once.

Which is exactly what I did:
pain127.jpg


As you can see here, the other companies will be updated in the future. The Square Enix folder is no longer there because I only need one Square Enix Component file now. It wasn't so simple getting this to work, I had to go to the page file and apply props (React terminology) to get the year I needed to then have the component get the correct data.

With that, whenever I need to change the visuals of the component, I no longer need to make that same change to repeatedly to multiple files for Square Enix. The Data Sources were originally stored in the components which was another thing that was hardcoded hence why it got moved to the data folder and is now exported over to the component.

By reducing the scale of the directory structure for building the webpage, it should make things quicker when applying changes since the space complexity should no longer be Linear. It is also possible that the file size for the JavaScript build file could get smaller, but it will probably not be significant.
 
Last edited:
webpage update, finished refactoring to reduce scale New
OP
OP
ggx2ac

ggx2ac

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

See the previous post above for context.

After a number of weeks, I have now completed refactoring the whole webpage to reduce the scale of it. There are probably a few minor differences you will notice in the Nintendo Earnings data and graphs (I have removed the bar stacking on most graphs).

To show how much of an effect this refactoring did, below are two images.

pain130_2.jpg

pain146.jpg


The first image is of an old build when I started the refactoring weeks ago where the peak size of the .js file was around 1661kB, the second image is the latest build and is live on the webpage right now, that means I reduced the size of the .js build file by almost 500kB but as mentioned before, it's not that significant for the user because they will always download the compressed version (gzip) of the file which means the reduction in download size is only around 50kB.

Regardless, fixing up the scale of the webpage means I can do more things with less effort and time. Which means I can choose to add more data and even add graphs for the other companies now.

That is all for the latest update.
 
webpage update, graphs added for sales per software unit New
OP
OP
ggx2ac

ggx2ac

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

If you have read the previous two posts, I can now show an example of how reducing the scale of the webpage did something.

By creating one graph that handles the software sales data for Capcom, Bandai Namco, Koei Tecmo and Sega Sammy, you can now see graphs for the software net sales, software units and sales per software unit for each of those companies and covering all the years that have software sales data.

Due to how Square Enix combines software units from their HD Games and MMO segments, I would have to make a separate graph for them whenever I get around to it.

The graphs are on the webpage right now for you to take a look, once more if you are on a phone, try using landscape mode and not portrait mode to get a closer view of the graphs.

Below shows that adding this new graph (and everything else needed for it to work) only added 7kB since the last build in the post above. This is to show the effects of reducing the scale of the webpage.

pain148.jpg


That is all for the latest update.
 
webpage update, playing cards added (and digital sales) New
OP
OP
ggx2ac

ggx2ac

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

I just added the sales for playing cards, dedicated video game platform and digital sales in dedicated video game platform to the Nintendo section in the part where it says, "Global Hardware/Software, Mobile, Playing Cards".

It covers from FY3/2017 to FY3/2023, what it adds is that you can see year on year percentages for it so take a look. That data is also in the graphs as well.

After I look at doing something else, the next step would be to refactor the Nintendo earnings part of the code since that is the oldest and it needs improvement.

That is all for the latest update.
 
Top Bottom