Photo by Dovile Ramoskaite on Unsplash

It’s All Vanilla… And That’s Good Stuff

David Wilson-Brown

--

Describe one thing you’re learning in class today.

One critical aspect that we’re learning in class today, or rather a light that has finally switched on for me, is the importance of pseudo coding. While not every programmer uses pseudo-code, there are those who like to dive in and build right away (due to deadlines, preference, etc.), I know that I am a huge advocate of pseudo coding. This is really becoming a part of my process because it allows me to piece out into words the specifics of a function that I’m working on. It’s for me, a useful tool to change the abstract into digital concrete. In fact, it supports the reason why a programmer who writes more (textually) is most likely one who grows in writing cleaner code. Here’s what I mean.

Let’s say you’re writing a function that incorporates pseudo code in the development process, and you start with basic verbiage such as “if x is greater than 2, then add ‘hello’ to the end.” In going back and writing this, you can substitute concatenate for add. Additionally, if you learn how to talk to a computer, which is clearly a dumb machine, in a clear and concise manner, then you are developing a skill set to take an idea and transform it into a working function.

This is starting to help in a lot of areas when it comes to JavaScript and finding ways to create working functions with various parameters and arguments.

What is the difference between == and === ?

The difference between a Double Equals and a Triple Equals is that a == checks if values are equal. For example, does 64 (the number) == ‘64’ (the string)? If this comparison were submitted, the result would return true. However, Triple Equals checks values in two ways. First, it determines if the two values are of the same type, then it checks if the values are equal. So, using the example of 64 === ‘64’, the result would be false because while they are both 64, one value type is a number and the other is a string.

What is the value of foo? var foo = 10 + ‘20’?

The value of foo is 1020. What is being carried out is the concatenation of the number 10 and the string of 20. Hence, 1020 is the value of foo. Interestingly enough, the year 1020, primarily in Europe, was pretty harsh. So in that sense, 1020 could be synonymous with ‘bar’, and from that, we could get FUBAR. Maybe, just maybe.

“Form follows function — that has been misunderstood. Form and function should be one, joined in a spiritual union.” — Frank Lloyd Wright

Describe what a terminal application is.

A terminal application is really the direct line to communicate with the computer, the command line or console, rather than going through the middle-man known as the Graphical User Interface or GUI (pronounced “GOO-EEY”), and we all know that can lead to a sticky situation. By running commands through the terminal, we avoid the repetitive nature of clicking, and clicking, and clicking. Using the terminal helps take us right where we need to go, add directories and files in bulk, and once you get acclimated to the commands for the terminal, routine tasks take less time. The trick, for now, is getting familiar with those commands.

Additionally, when building a program with Javascript, the terminal is the bare-bones place that does everything. If you’re building a game, the terminal end is where you see if the game works. It outputs the results and lets you know what’s working and what’s not. This is also where a developer can run tests they’ve created for their JavaScript program and instantaneously see if their functions caused the tests to pass or fail. Once you’ve completed building everything on the terminal end, a developer can then focus on the UI design.

What is the ternary operator?

A ternary operator (also known as a conditional operator) ultimately creates a more concise statement compared to an if-else statement. Using the example below, the meaning of it breaks down like this:

condition ? expression1 : expression2

If the condition is true, expression1 will be carried out, but if expression1 is false, then expression2 will take effect. One way that I’ve tried to remember this, is by using the punctuation of the ternary operator to both dissect it into its three components (hence the term ternary) and read it aloud using the punctuation to aid in the vocal inflection. Sounds a little crazy, but hear me out.

Imagine the first section: condition ? being read aloud as a question, with the inflection going up. Next, if that’s true, then expression1, the second component will be executed. But if expression1 is not true, the colon in

Does this make sense ? if so, then great : if not, forget what I said and use what’s best for you.

What are some ways to ensure that your website design or web application is accessible and user-friendly?

Keeping the end result in mind while also focusing on the process tends to be a solid two-fold anchor, not just for a developer, but for anyone really. Ultimately, we’re faced with challenges or problems that need a solution or an idea of something, and we can probably go as far as to envision the result of what we’re trying to overcome or create. By keeping the end result in mind, along with careful planning and respecting the process can aid in creating a design or application that is not just user-friendly but effective. Some questions to consider while creating an app or website could be:

  • Who’s my audience?
  • What are my calls to action?
  • How can this website or app be utilized by people? Not just users, but really people.

With those questions in mind, I’m able to keep focused on what I’m trying to create, especially when researching and tinkering sends me down those digital wormholes.

For my project, I’d like to create a rehearsal and memorization app for actors, students, public speakers, or anyone that has a need to truly memorize a body of text. However, I’m also mindful of how simple the application will need to be. It’ll have to organically lead the user to input their text, and return tools, tips, and tricks for memorizing their chosen script or speech. Additionally, the app will have to also be created with accessibility in mind. This aspect is particularly important for me and a bit personal. Being a parent of a child who has a slight visual impairment, it’s important for me to create something that he can use. In fact, the app should go even further to provide actors or speakers who rely on screen readers, accessibility to use the tools within the app to help them accomplish whatever material they are working on.

By balancing a careful process and creating with the end result in mind, helping people, is a sure way to ensure that your site or app is accessible for everyone.

What are your favorite features of HTML5, and how have you implemented them in your front-end development projects?

Two features of HTML5 that I’m really excited about implementing into future projects are the audio/video tags, which allow developers to implement players without having to build one from scratch. Being tied to the arts, and really seeing the need for incorporating audio tools into my app will benefit users or students in the learning process. The other feature that I like is the placeholder tag. This will help guide the user towards a streamlined experience when inputting large bodies of text and other information necessary to develop a memorized work.

How do you structure your CSS and JavaScript to make it easier for other developers to work with?

Because development is truly a collaborative effort, and so much that often at times you may not work with or even meet the developers whose code you are directly working with, the credo of leaving something better than when you found it is a golden rule.

Everyone is on their own journey in development, some of us (ahem) are newer than others, and some have years of experience, but in the end, the work speaks for itself. Habits are formed, processes vary among developers, everyone’s got an opinion, and rightfully so. However, one thing everyone can agree on is respecting the process and writing code that is easily understandable. This can include pseudocode that explains how the CSS and JavaScript relate to each other, or font styles and weights that have to be used because they’re tied to a company’s brand. If there’s a snag in the code, and a developer is in the process of working out the kinks, by being mindful of clear communication, the quality of the work improves for everyone.

One approach towards writing JavaScript is the Module Pattern, which Chris Coyier from CSS Tricks writes about here. For ways of organizing CSS, author Inessa Brown wrote an article for CSS Tricks that includes the following methods: OOCSS, SMACSS, Atomic CSS, MCSS, AMCSS, and FUN. Brown’s article can be found here.

What’s your process for addressing browser-specific rendering problems? Do you find that a certain browser is more challenging to work with than others?

Let’s face it, as the demand for user privacy continues to grow and online experiences are tailored to the individual rather than the whole, challenges are presented to the developer concerning browser-specific rendering problems. On the flip side, this is great news for sets of developers that are creating tools to battle these issues. Just as open-source code provides an incredible resource for the developer community, advice along with tips & tricks from others are just as useful. One resource that gives a concise and go-to list is an article posted by Shubham Saxena on lambdatest.com found here. Some of these great tips include using separate stylesheets for different browsers, CSS resets and utilizing CSS Grids and Flexbox to help with layout compatibility.

Newer browsers may present more challenges than those such as Chrome and Firefox, and honestly, Internet Explorer and I need to work on our relationship. What I really think though that Saxena is talking about, is incorporating skills and tools into the process of development. By using proven methods such as resets, Grid, and Flexbox, a developer can be ready for change.

--

--

David Wilson-Brown
David Wilson-Brown

Written by David Wilson-Brown

0 Followers

Student of Web Development at Austin Coding Academy | Actor & Director | Educator

No responses yet