React Native

Having decided to step into the world of Mobile Software Engineering, excited for the satisfaction I’d found in developing iOS apps in XCode and Swift, I embarked upon React Native.

Getting set up took a little while. This is not a simple case of downloading an IDE to use and getting started with your first ‘Hello World’ in your shiny new language. After downloading many packages, languages (I was not expecting to require Python2 for this), and additional Android Studio tools… the emulator was still not working. I had been eager to begin a React Native application and put to the test the knowledge I’d gained about how this all works but I was struggling to get a simple app to load.

I then discovered the glorious Expo. Expo can be installed and run from bash (if Windows’ amazing start bar search will stop hiding my Git Bash from me for some reason – is it because I refuse to enable Cortana to listen in on me at all times in case I happen to mention its name? – perhaps a rambling for another time).

After struggling to get past even the dependency graph load without Expo, I immediately saw the results load on the Android Emulator I had open when I ran ‘expo start’ from within my project folder. I was so pleased that I downloaded the Expo app on a handy iOS device so I could watch both screens update simultaneously as I developed my apps.

I am always impressed at how erm – Reactive – React Native is. I can add a new <TextInput/> into my render function, save, and immediately see a new text input component on both the Android emulator and the iOS device. This is fantastic for ensuring the development of apps which are performant on either OS and perhaps encouraging continous development (ensuring that the changes made could be deployed at any time).

As I’ve been setting up React Native on my current system, the small apps I’ve developed so far have not really been blog-worthy – basic tutorial following and messing with styles etc… I’ll get back to you when I’ve made something somewhat interesting šŸ™‚

React.js

Whilst hunting for a job, I have aimed to continue learning new things. My web development experience has sometimes led me to stackoverflow answers raving about how this question would be easily resolved using React, a JavaScript library constructed by Facebook, and I decided that, now that I have the free time to expand my skillset, React would be a good place to start.

I completed the fantastic Codecademy tutorials and various online walkthroughs until I felt that I had the basic concepts down.

React aims to create a more responsive JavaScript system in which a component changing on a web page does not result in the entire page having to reload. Sounds like common sense really but this is not how things usually work.

For example, if a single item in a list is changed, without React all that would be known is that Something has changed and the entire page and all of its components would be loaded again to bring in that change. Now that we have React, we can use something called a Virtual DOM (Document Object Model). What this allows is for the ‘changed’ model to be compared to a temporary ‘copy’ of what it looked like previously and for only the differing areas to be reloaded, saving time and allowing for an overall more responsive system.

The other area on my list had been the use of Android Studio, which had been downloaded on my laptop since I realised that I was missing using XCode in Mobile Computing and wanted to keep developing apps whilst still learning.

Whilst discovering React.js, I found out about React Native – which uses the basic principles of React to produce performant apps for iOS and Android without having to use different, specific code, languages, and environments for each. This seemed the perfect next step in my learning and I had just seen a very interesting job advertisement for a position using these technologies – so I decided to give it a go…

Doggo Generator

Today made a simple program to practice a bit of Java to make sure I still remember everything.

It may not be the neatest but it was a whole lot of fun!

First I made three classes: infoGatherer.java, Dog.java, and infoGenerator.java.

The Dog class just initialises three attributes of the class Dog and contains their getters – functions which return a value to whatever is asking for it.
package org.jennings.miriam;
public class Dog {
String breed;
int age;
String colour;
public static String getBreed(Dog dog)
{
return dog.breed;
}
public static String getColour(Dog dog)
{
return dog.colour;
}
public static int getAge(Dog dog)
{
return dog.age;
}

In infoGenerator, I decided to randomly generate values for the age, colour, and breed of the dog each time the program is run.

I set some array data – a list of values to select from – for colour and breed, and generated random numbers as indexes for these arrays to select values and for an age between 0 and 30.
I then used setters to set these generated values for the attributes seen in Dog.java.

In infoGatherer, I accessed the getters to retrieve the values held for the new dog generated, and outputted a greeting in the form:
String description = (age + " year old "+ colour + " " + breed);
System.out.println("Hi! I am a " + description + "!");

I then thought that I could do something more interesting with this description.
I wanted an image of the dog to go with the greeting, but just showing a picture of any dog wouldn’t do. These dogs were being randomly generated every time the program ran. I needed to search for a dog image matching the description every time a new description was generated.
I made another class ‘imageFinder.jpg’ and learnt how to use Jsoup – a Java library for connecting to webpages and retrieving information, and followed a tutorial at https://www.javacodeexamples.com/jsoup-download-images-from-webpage-example/815, adapting the code a little for my purposes.

This allowed me to save the first image which appeared in an image search for the description which had been generated.

Now I was obtaining a dog image saved to my laptop every time I ran my program – definitely not something I would complain about! However, I only needed one image at a time so I made the program give the image the same name every time – overwriting the saved doggo.jpg.
I then inserted a few lines to open the file which had been saved…

Desktop desktop = Desktop.getDesktop();
File file = new File("C:/Users/miria/eclipse-workspace/Fun/DogImages/doggo.jpg");
if(file.exists()) desktop.open(file);

Now my program generates a description of a new dog and then shows an image of a dog for this description.

I made a cat.

Spin-off of “Project: Wild animal”

Today I was looking through job advertisements and nothing seemed right to me. Trying to imagine what the ideal job would look like, I realised that I had lost my enthusiasm for programming things and wanted to get that back. First I thought about starting some new project but wanted to just do something quick and fun. I headed to Khan Academy, remembering how much I enjoyed Summer of Code a few years ago.
There were some challenges available which, although they were just simple drawings using shapes, were a quick fun challenge. I drew a snowman and then a cat. Here is my cat. šŸ™‚

Being in Final Year

Something which I really enjoy about final year is the way that my degree is coming together. My dissertation uses skills from my Scripting Languages module and all of the Databases modules, as well as Human Computer Interfaces in first year, and even things I’ve picked up from projects outside of uni such as kitchensplus.eu. My Game Theory and Formal Methods modules only mean anything to me because of Foundations of Computer Science and Logic in Computer Science. My modules this semester: Formal Methods, Multi-Agent Systems, and Advanced Web Technologies, are all so related to one another it’s fascinating. On the first day back, I went from discovering about The Semantic Web in a Web Tech lecture immediately to it being mentioned in Multi-Agent Systems. In one MAS lecture I was confused as to why the lecturer was introducing logic symbols we had just been using as though they were a new topic, until I realised that was in Formal Methods. It’s very nice to feel that none of these are isolated topics and everything can build upon past experiences. When I was studying Game Theory I was just doing it out of interest and for fun, I didn’t think it would be relevant, and yet Nash Equilibria and optimisation techniques are actually pretty important in MAS, so I will find these applications easy to pick up and understand.

 

 

Prospects for Leaving Uni

I have been terrified of the idea of leaving education for a long time. The idea that I just have to go out into the world and find someone who wants me to work for them so that I can get money to live is scary. However, since meeting Bourban last year, I have really been looking forward to my future.

I am very proud of him for securing a place at Abertay University to study for an MProf in Games Development Ā and although it’s scary to move all the way up to Dundee next year, it has given me direction and a better feeling of certainty about what the future holds. I can now narrow my job search to the area in and around Dundee, and have the motivation of supporting the both of us for the year which makes me much more enthusiastic about the world of work.

Since I’ve never had an official salaried job, I never realised how much experience I have. From helping with various office and accounting tasks at my dad’s job all my life, to assisting on a website project for my brother’s company, making Bourban’s and my own wordpress sites, and various favours such as modernising kitchensplus.eu , I have plenty of work experience – I just never seemed to count it as work since I was just helping people out.

I know that I will miss uni but I am also unbelievably excited to go out there into the great wide world and get on with it.

 

 

Software Engineering II

Software Engineering II really brought together a lot of real world practical skills. Now that the module is over, the idea that I won’t be able to take any more modules taught by Sebastian Coope, with his decades of industry experience and wealth of knowledge of real-world workplace issues and anecdotes, is upsetting.

Seb introduced us to many concepts from pair programming to poker planning, the details of XP and Agile Development, and project management issues, whilst giving out tips on how to ensure that we communicate realistic time and cost estimations, improving our EQF, and general good practice programming and debugging techniques from program slicing to object patterns.

This is possibly one of the most invaluable modules I have studied at University, and has really been made relevant and useful by Seb.

Introduction to Computational Game Theory

Another module in the first semester of my final year was Game Theory. To the uninitiated, this may sound like some kind of Computer Games Technologies module, not so much.

‘Games’ refer to mathematical games – the idea that decision-making can be represented mathematically in many situations. This was only an introductory course, so remained relatively simple, but was fascinating none the less. Discovering that even theoretically, as long as everyone is telling the truth, truthfulness remains the dominant (optimal) strategy, was particularly poignant.

We were taught about finding Nash Equilibria (the combination of choices under which no player wishes that they had made a different choice), about auctions of different types, and about the strategies used by search engines to auction off page positions for particular queries. We also covered potential gamesĀ  as well as matching markets- finding the optimal result for all sellers and buyers in a market (those with higher valuations of a product are more likely to get it, and others will get a different product) – and finding market clearing prices – the prices at which each product would be preferred (or is indifferent for) a buyer.

Although I’m unsure whether selecting this module was the most useful for my desired future career in software development or web development, I was fascinated by the topic and priveleged to take advantage of the opportunity to be (wow, if we had a simple word like aprovechar eh?) taught by Professor Paul Spirakis, who had casually proved some unproved theorem or something over the summer before returning to teach us.

Mobile Computing

In first semester of my final year at the University of Liverpool, I studied the module Mobile Computing. The assignments for this involved learning to use the Swift programming language to program iOS apps using XCode.

The first assignment was to draw in json-encoded data on various research articles and use this data within the app. The data given included the title, authors, a link to the pdf of the article etc, and had to be separatedĀ  into the relevant variables for use within the app. The Swift programming language has some unusual features which were useful here.

Apple’s Core Data was also useful as a ‘favourites’ button could be used to select and deselect favourite articles, which would be maintained between sessions.

 

The second assignment used the same ideas for an Artworks app, but with the additional inclusion of images, maps, and location data. Each artwork had associated coordinates which were used to place an annotation on the map. The artworks were also ordered by distance from the user’s current location, and Apple conventions, such as requesting to use location services, were implemented.

 

The final coursework for this module was simply a portfolio of simple apps such as a multiplication tables app, a ‘favourite places’ map application, and a ‘To Do’ list app (using Core Data).

 

The content of this course was also fascinating. It covered everything from cell networks and handover types to the rise of m-commerce and the challenges in developing for mobile vs desktop systems.

C++ Game Engine

I followed this tutorial to create a Game Engine in C++ and SFML .

I was apprehensive, since creating a Game Engine sounds like a vaguely daunting task.

I am getting the hang of the setup for SFML, and decided that I don’t need to keep practicingĀ  it every time so I exported the template of the properties for this project once I had set it up so that I can reuse them in the future.

[The property changes are fairly simple.

1. Go into the Properties of the project.

2. Under C/C++ -> Additional Include Directories, put the location of the ‘include’ folder which came with your download of SFML.

3. Under Linker -> General -> Additional Library Directories, put the location of the ‘lib’ folder .

4. And under Linker -> Input -> Additional Dependencies, add the graphics, window, and system .lib file names spearated by semi-colons(;).

Press ‘Apply’ and ‘OK’]

5. Also, ensure that the .dll files are held in the Debug folder of your Project.

Once this was all complete for my Game Engine project, I began to follow the tutorial.

There’s no point in me repeating what you can find here, since I did pretty much exactly that. There were points (such as creating three separateĀ  .cpp files for Input, Update, and Draw…?) where I was unsure whether the tutorial was going about it in the right way, but as only my third project in SFML, I didn’t feel that this was the time to be going rogue.

I will, however, summarise the Game Engine.

The Game Engine consists of 6 .cpp (C++) files and 2 .h (Header) files (not including targetver.h, stdafx.h, and stdafx.cpp, which are all there as default).

These files are: Main.cpp, Engine.cpp, and Player.cpp; Input.cpp, Update.cpp and Draw.cpp; and Engine.h and Player.h.

Main.cpp simply calls the constructor for Engine, calls the start method for Engine, and returns 0 when complete. This is the entire functionality of the program, on the highest level (the game engine is made and started, when it is finished, the program finishes).

Engine.cpp and Engine.h work together to provide the overall functionality at a slightly lower level. Engine.cpp sets up the window size and background texture when constructed, and its ‘start’ method initialises a clock and contains a while loop calling input, update (and passing it the current time), and draw methods as long a the window is open. Engine.h just contains all of the variables and methods of Engine, and is included by Engine.cpp to be able to use these.

Player.cpp and Player.h (called ‘Bob’ in the tutorial) provide player setup and functionality. The contructor brings in the texture for the player, and initialises the speed, and x-y position of the player. There are then 6 methods: getSprite(), moveLeft(), moveRight(), stopLeft(), stopRight(), and update(). The only one of any real interest is update(), which takes in a time parameter, to be multiplied by the declared speed to calculate the distance traveled and add it to the x position (right), or subtract it from the x position (left). Again, Player.h simply creates all of the required variables and methods.

Input.cpp just takes user keyboard input and calls the appropriate method- wouldn’t this be better in the Player.cpp and Engine.cpp files?

Update.cpp just calls the update method in player, passing it the time from Engine.cpp. This call could be in Engine.cpp right?

Draw.cpp clears the window, then adds in the background and player sprites and then calls display();.

And that’s it! All of these parts will work together to run a simple game, and more functionality could always be added to these components to create a more complex game using this Game Engine.

Please comment below if you can explain to me why there is a need for separate Update.cpp, Draw.cpp and Input.cpp files.