Forem: Stephanie Hope

Learning things about PHP during Advent of Code (Days 1-3)

Stephanie Hope — Wed, 04 Dec 2019 07:01:35 +0000

Last year, I found out about Advent of Code a few days after it began, and never managed to get caught up. I had to drop it in the first week due to being busy with university work, but came back a few times over the past year and eventually ended up stuck on Day 11.

I'm hoping that a year later I'm able to get a bit further. This time I'll be doing the puzzles in PHP, since that's what I'm using in my internship at the moment. My very first observation, after using Java last year, was that getting the input file in is so much easier now!

I found Day 1 fairly straightforward, and made a few initial mistakes on Day 2 but was able to fix them. Day 3 seemed like a big jump in difficulty. It took me a while to get my head around what needed to be done, and then when I (thought I) had it, I wasn't sure if my code was even working it took so long to finish. That's the solution I posted in the thread here. It took over 7 minutes to run.

I knew that there had to be something I could do, so I looked up other ways to check if something was in an array. I found out about the key_exists() method, and after changing my code so the array used keys (like the maps I'm familiar with from Java) I managed to decrease the run time from over 7 minutes to around 0.1 seconds!

I was amazed that this small change produced such a huge improvement. Looking at this Stackoverflow question and its answers I learned that arrays in PHP are actually hashmaps, and that searching for a key is O(1) while searching for a value is O(n) - I've never really learned about Big O notation, but I do know that O(1) is better (best?).

My final code is like so:

$input = file("input3.txt");

$wire1 = explode(",", substr($input[0], 0, strlen($input[0]) - 1));
$wire2 = explode(",", $input[1]);

$wire1_posn = trace_wire($wire1);
$wire2_posn = trace_wire($wire2);

[$distance, $time] = find_intersections($wire1_posn, $wire2_posn);
echo "\n min distance = $distance, min time = $time\n";

function find_intersections($wire1, $wire2)
{
    $distances = array();
    $times = array();
    foreach ($wire1 as $posn => $steps){
        if (key_exists($posn, $wire2)){
            [$x, $y] = explode(",", $posn);
            $distances[] = abs($x) + abs($y);

            $times[] = $wire1[$posn] + $wire2[$posn];
        }
    }
    return array(min($distances), min($times));
}

function trace_wire($wire)
{
    $x = 0;
    $y = 0;
    $steps = 0;

    foreach ($wire as $path) {
        $direction = $path[0];
        $distance = substr($path, 1);
        if ($direction == "U") {
            for ($i = 0; $i < $distance; $i++) {
                $steps++;
                $y--;
                $wire_posn["$x, $y"] = $steps;
            }
        }
        if ($direction == "D") {
            for ($i = 0; $i < $distance; $i++) {
                $steps++;
                $y++;
                $wire_posn["$x, $y"] = $steps;
            }
        }
        if ($direction == "L") {
            for ($i = 0; $i < $distance; $i++) {
                $steps++;
                $x--;
                $wire_posn["$x, $y"] = $steps;
            }
        }
        if ($direction == "R") {
            for ($i = 0; $i < $distance; $i++) {
                $steps++;
                $x++;
                $wire_posn["$x, $y"] = $steps;
            }
        }
    }
    return $wire_posn;
}

I hope I keep learning useful things this month!

(My other solutions can be found on my GitHub, here.)

back-to-front or front-to-back?

Stephanie Hope — Sat, 22 Jun 2019 10:34:02 +0000

For a course I'm taking next semester I will be building a web app. It's nothing very complex - different types of users can view and create/update different types of stored information. The point of this course is more the opportunity to try out new technologies than to create a great product.

I intend to use Spring (or Spring Boot? I haven't yet figured out the difference) for the backend and probably Angular for the frontend. I have never used either of these frameworks before, nor do I have any idea how they work.

Which side should I start working from? I'd at least like to be able to make a start on figuring out one end before I start to confuse myself by mixing the two.

I've tentatively selected Angular over React or Vue for the frontend because I've heard it's popular / in demand here in New Zealand, but is there a solid reason I should consider using something else?

Do you know of any extremely beginner-friendly resources I should look at for any of these frameworks? I'm hoping to spend the next couple of weeks starting to get familiar with them before the semester begins.

A beginner tries basic accessibility testing

Stephanie Hope — Mon, 10 Jun 2019 10:45:49 +0000

I've just finished building my first client website - just a very basic single page thing but hey, everyone has to start somewhere.

I wanted to make sure it was accessible, so I tested it using both the Axe extension for Firefox, which I'd used in an assignment in the past, and Chrome's Lighthouse testing which I've seen referenced in other articles. I'm aware that these tools aren't perfect but I figured it's a solid start.

The initial result was... not great.

One thing I found though, is that with a small site like this a small number of issues can really lower the score, and conversely fixing even the easiest will really improve it.

Two of the four issues highlighted in the Lighthouse report were due to things I'd just mistakenly left in the HTML.

[id] attributes on the page are not unique

I had accidentally used the same id on two similar sections of the page. Easily fixed by changing one of them.

Lists do not contain only <li> elements and script supporting elements (<script> and <template>).

Due to some kind of copy/paste mix-up, a list contained an empty paragraph. Removed it, et voila:

I guess these kinds of things don't happen to people with more experience, but for me it was nice to see that a minute or so improved the score so much.

Then onto the other issues:

Image elements do not have [alt] attributes

Six items were failing on this point. I'd added [alt] text on a few other images used on the page, but these ones were purely decorative so I hadn't bothered. But if it was being flagged up, obviously there was something else I needed to do!

After a quick search I found that when images are purely presentational they should have empty alt text [alt=""] to indicate this fact. Another easy fix! I felt like I was on a roll!

Links do not have a discernible name

This one gave me more drama than all the others combined

The linked information in Lighthouse didn't help me out much. It was all very much about making sure text is associated with every link, which obviously is generally a good thing! In my case, though, the links in question were images which also had a text link to the same location beneath them.

I tried applying [tabindex="-1"] to the images, so that they couldn't be focused by the keyboard. Though they were no longer tab focusable and thus to my limited understanding shouldn't be presented to a screen reader looking for links, the error remained.

After quite a long time searching around for ways to fix this, I was just about on the verge of giving up, but decided to check Axe and see if it had any other issues still remaining. It only had the same one, but it turned out that its solution advice was much more helpful to me.

All the advice from Lighthouse had been regarding adding text, but this gave me other options.

First I tried adding [role="presentation"], since that sounded the quickest. Unfortunately, I wasn't that lucky, as I somewhat suspected would be the case as a link whose role is presentation doesn't make sense.

The solution turned out to be in the third suggestion in the list: "aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty". Indicating that the icons are labelled by the text link that follows them seems to have fixed the issue, at least as far as both Lighthouse and Axe are concerned.

My lesson from this first foray into accessibility testing is that there's no need to be afraid, with the help of tools and googling it's quite achievable.

What's the best way to store data for my very basic app?

Stephanie Hope — Thu, 30 May 2019 11:12:23 +0000

I'm creating a very simple app to visualise my progress and grades in my courses, which is something I used to do on paper back in undergrad. I figured it would be a nice simple project which would actually be of use, if only to me.

I've started out creating it as a web app, creating SVG using Javascript. However, I've run into a snag with how to actually get the data in. I want to be able to use a form (or similar) to add new data when I receive grades, but I don't know how to store and access that data.

From my research, it seems that I can't access a database using Javascript, and I also can't access a local JSON file. Is there another way to have this data stored and be able to be updated and saved? Do I need to create a Java servlet just so that I can read/write a JSON file? (Java is the only backend I know so far, but if there's something else that will make it easier, let me know!) Is this the time to learn one of these mysterious frameworks everyone's on about?

My other alternative is to give in and do the whole thing in Java, but I'd like to have the possibility of putting it online eventually rather than having it tied into a desktop app.

Any advice?

Isolation and community

Stephanie Hope — Thu, 04 Apr 2019 08:43:05 +0000

I had a blessed introduction into this field, so I'm a bit delayed in discovering how isolating it can feel - but boy, it's hitting me recently. This post isn't necessarily about coding but maybe more about the university experience, so I'm not sure that this is the right venue for it - but I still feel like writing it is worthwhile for me.

Over the summer I took a 12 week intensive course, and despite going in with fears that everyone else would be stereotypical 'computer guys' lacking social skills and I wouldn't connect with anyone, that didn't eventuate. In fact, of the nine students who finished the course seven were women, and by the end of the semester the whole class felt like friends (or to some extent like we'd been through a war together 😅)

At the end of that course, while chatting with our teacher he mentioned that at least our further studies (seven of us continued to the follow-up course, which is more of a typical University experience) would be less intense. I suppose that in terms of sheer hours required that's been the case, but I've found this semester so far much more stressful. The summer course was one cohesive unit, so the workload was balanced and controlled by a single teacher as opposed to the times now when four lecturers set assignments due at the same time - as well as the fact that the practical, coding assignments over the summer were much more enjoyable and felt more relevant than writing research reports and giving presentations.

What's really making it feel harder for me, though, is the loss of the camaraderie of my summer course-mates. Helping each other and commiserating through the tough parts was hugely more comfortable than showing up at lectures, sitting in silence, then leaving alone. I realised last week that there have been many days where I didn't have a single reciprocal human interaction - to the point where being asked for directions on campus was a highlight of my day.

As a shy person, I find it hard to know how to counteract this situation, especially at this point in the semester - maybe in the first week it makes sense to start up a conversation with someone new, but not so much half-way through. I feel an extra level of inadequacy as most of my classmates have completed a full CS degree rather than the 12 week course I did, so I'm constantly doubting my usefulness.

The reason this is on my mind tonight in particular is that I had my first experience of feeling like a part of the 'I.T. community' tonight. While I was working on an assignment at Starbucks, a man who'd seen what I was working on came up to me asking if I was a web developer. He was a self-taught student, complete with a textbook in his hand. We had a chat (after I disabused him of the notion that I know anything) about how hard it is to learn things in such a broad field, and about the scariness of the job market, among other things. It was so nice to feel less alone in this journey for a while, even if we're taking different paths.

Being a failboat, I didn't write down his name or get his contact details, but: if you're reading this, man from Starbucks in Hamilton, I believe in you! And thanks for helping me believe in myself just a bit more as well.

Nevertheless, Stephanie Coded

Stephanie Hope — Fri, 08 Mar 2019 19:44:56 +0000

I started to code in late 2018 because...

I loved the idea of a job where I could point at something and say "I helped make that". Coming from an analytical laboratory background, that wasn't something that often happened, and I was looking for a change.

I deserve credit for...

Taking the plunge and leaving my job of many years to go back to University. The course I took over the summer was a 12-week bootcamp-style course in web development and Java, and I passed with an A+. I'm now studying towards a Masters in Information Technology, at age 32.

I hope to see my school/work/developer/tech community...

Continue to improve in its inclusion of women and minorities. I was encouraged (and, sadly, surprised) that my class of 9 students over the summer consisted of 7 women and only 2 men. But I note that every industry speaker who gave a talk to us was a white male. I'd like to see more diverse mentors being invited by the University.