DEV Community: Nathan Jeffrey

Building with Industry 4.0

Nathan Jeffrey — Thu, 23 Feb 2023 16:55:12 +0000

Welcome to the future, where Industry 4.0 reigns supreme. The Fourth Industrial Revolution is upon us, and it's changing the game of manufacturing like never before.

Imagine a world where machines aren't just automated but are also interconnected, constantly communicating with each other and the internet. This level of connectivity opens up a world of possibilities for a smarter, more efficient, and flexible manufacturing system. With advanced technologies like IoT, AI, and machine learning, the factory floor has become a cybernetic organism - alive, constantly adapting, and always hungry for more data.

The benefits of Industry 4.0 are too great to ignore. With the ability to optimize processes and resource usage, factories can reduce waste and energy consumption, making them more sustainable and environmentally friendly. And with the power of data at our fingertips, we can predict machine failures before they occur, minimizing downtime and maintenance costs.

Enginuity Inc, a high-tech engineering firm that operates on the East Coast of North America has been leading the charge on Industry 4.0 solutions for businesses.

While there are all kinds of examples of solutions that can be applied my introducing IoT to manufacturing processes, Enginuity Inc has taken it to another level by implementing things like SCADA systems and Vision grading systems for Industry 4.0.

One of the most significant impact of Industry 4.0 is on the workforce. As machines become more intelligent and connected, traditional jobs are becoming redundant, and new roles are emerging that require a whole new set of skills. It's a world where the line between man and machine is becoming increasingly blurred, and those who can adapt and thrive in this new cyberpunk reality will be the ones who come out on top.

Welcome to the future of Industry 4.0.

Transitioning To SASS - A Beginners Guide.

Nathan Jeffrey — Wed, 24 Jun 2020 12:00:49 +0000

Sometimes it's tough to give up the things you are comfortable with. Even though you might know deep down that breaking your old habits or learning something new is the right choice, it's still hard to actually do it.

I was pretty comfortable with my CSS knowledge when I started my new web development job. Now, I still needed to look something up every time I started styling but I'm going to blame that on staying up past my bed time too often.

My new development role is spend mostly working with Drupal and so far, the Big Commerce framework Stencil and the amount of time that I've spend smashing my head against the proverbial wall has forced me to find efficiencies elsewhere

*SASS enters

The theme we work with in Drupal and the Stencil framework comes set up with SASS out of the box - we just weren't using it to its full capabilities.

What is SASS?

SASS stands for Syntactically Awesome Style Sheets. It's essentially an extension language for CSS that takes your grandmothers walker and turns it into a sweet hoverboard or one of those water jetpacks. It sounds like my grandma would've loved SASS, I'm sure.

SASS takes your normal CSS styling language and turns it into a programming language by giving it additional capabilities.

SASS works by compiling your .scss files and creating CSS generated sheets specifically for your project. It takes the variables and all of the other features of SASS and creates the typical CSS stylesheet your used to seeing.

Coming from a mostly front-end word, turning my beloved CSS into a programming language sounded scary.

Here's why it shouldn't be scary for you.

What we'll cover here

I'm going to go too in depth with SASS in this post. Frankly, this is probably just me getting my thoughts written out but hopefully this can help you get started with SASS. Here's what we'll cover

Specifically, SCSS

$variables

@mixins

_partials

...and more

SCSS - Sassy!

SCSS and SASS files extensions are similar in many ways. We'll be focused on SCSS (both in this article, and in practice) and I recommend you do the same.

The reason is that SCSS files are very similar to the CSS syntax we're used to writing and standard CSS will work in files with .scss extension

/// This is a .scss extension file
body {
    color: $primary-color;
    padding-top: 15px;
}

/// This is a .sass extension file
body
    color:orange
    padding-top: 15px

$variables

For me, variables were one of the deciding factors that brought me to SASS. This is a powerful bit of syntax that not only solves the problem of always rewriting the same code on a certain project, but also gives you some relief when you're dealing with clients who can't seem to make up their mind.

With variables, instead of changing a color hex code 20 times in your CSS file for that client, you're only changing it once.

Here is a simple example of variables in action

$primary-color: #f05a28;
$primary-font: "Lato", sans-serif;

h1 {
    color: $primary-color
    font-family: $primary-font;
    padding-top: 15px;
}

Variables are a game changer for CSS. This helps us maintain consistency across big projects.

@mixins

Mixins take variables to the next level. I guess you could think of mixins as variables for blocks of CSS. For example, if you're always having to create the same blocks of styling over and over for different classes, mixins are the solution.

There are a number of reasons why we would use mixins but this is the method used most often for me.

@mixin removespace {
    margin: 0;
    padding: 0;
    width: 100%;
}

.box-of-space {
    @include removespace;
}

/// Here is the CSS output
.box-of-space {
    margin:0;
    padding: 0;
    width: 100%;
}

The power of mixins doesn't stop there. Mixins have the ability to essentially become a function. If you're familiar with Javascript, this might make more sense.

@mixin rtl($property, $ltr-value, $rtl-value) {
  #{$property}: $ltr-value;

  [dir=rtl] & {
    #{$property}: $rtl-value;
  }
}

.sidebar {
  @include rtl(float, left, right);
}

This is a snippet from the official SASS docs.

I'll be honest, I've never actually had to use this feature. Although I haven't used it, it doesn't mean we shouldn't know about it. Think of how much easier Dark Mode becomes if we're going to use them.

_partials

Partials are something that I'll be taking advantage of now that I'm working with a team in a professional setting. Partials are files in your library that aren't actually generated into CSS, they almost act like references.

/// file:  _button.scss

$bgColor: #58585b;
$type-family: "Lato", sans-serif;
$primary-color: #fff;


/// file:  style.scss

@use button

.angry-button {
    color: button.$primary-color;
    font-family: button.$type-family;
}

.overlay {
    background:button.$bgColor
}

For us, we can start creating a library of partials that we can send to our development projects to speed up building process and create brand consistency.

For clients with multiple websites, we'll see huge benefits with partials.

What else?

There is way more here in SASS that I'm not utilizing. Here are a few:

Nesting

Inheritance

Operators

Functions

A few minor features I frequent

Nesting and being able to access the parent selector with & has been extremely helpful. It helps keep my code readable and clean.

/// Nesting

header {
    color: white;

    &:hover {          /// Genertates header:hover
        color: blue;
    }

    ul {
        margin: 20px;

        li {           /// Generates header > ul > li
            color: green;

            &:hover {  /// Generates header > ul > li:hover
                color: yellow;
            }

        }

    }

}

SASS has been an amazing tool for speeding up the design process and being able to reuse components from previous designs without putting all the leg work into re-creating.

If you haven't tried SASS, hopefully this can act as a very brief intro to a tool that will certainly help you improve your styling capabilities.

Why You're More Qualified Than You Think In Tech.

Nathan Jeffrey — Sun, 31 May 2020 22:58:37 +0000

How seemingly irrelevant experience can lead to your first developer role.

My perspective on getting a career in tech has changed drastically in the last 2 years, and even more in the last 6 months. I'd like to tell you a bit about how my seemingly irrelevant experience led to my first developer role.

My Experience

Mechanic

Let me rewind way, way back. The start of my professional career was spent as a pretty dirty mechanic. I changed oil, busted my back and did all the work that the clean technicians didn't want to do. I'm not going to lie, I hated it.

I wanted to become one of the clean technicians so I spent my nights reading documentation and diagnostics charts. When I was at work I would ask questions and went above and beyond to demonstrate my desire to learn new things.

Eventually I became the guy responsible for diagnosing and repair some of the most complex problems in modern highway technology - I made my way to a Computer Systems and Electronics Technician.

How this would be relevant in tech

There are a number of things that I took away from this position that would be relevant to tech and a few more that my employer thought was desirable.

What I took away

I quickly realized that no one can do it alone. Or at least, if you do, it makes things way harder and takes way longer. I learned to ask my peers for help, but I made sure that my learning path didn't rely on anyone else having to teach me.

What my employer saw

Of course there is some speculation here, but this is based on our conversations. When I explained my story, they saw a willingness to learn and a problem solving mindset. The role of a mechanic is mostly solving complex problems on equipment that's extremely challenging to work on.

Entrepreneur

My most recent role was spent running a wellness center along side of my wife. She was a dietitian, we both enjoy staying fit, naturally we started a wellness company that brought together Nutrition, Fitness, Massage Therapy and Wellness.

While I won't get into the misconceptions of owning a business in this post, my role was very hard to describe. As many people know, small business owners wear many hats. This was no different for us.

In the beginning I was working on the business, teaching fitness classes and cleaning. Being completely exhausted and not to mention still working as a mechanic full-time.

When we realized that these tasks, or working in the business was actually hurting our progress, I shifted to bigger picture things.

My role transitioned over the years to marketing. I took care of everything from high level to low level tasks. I would construct annual strategy templates, build ad campaigns on a number or social platforms and help my wife with as much as I could on the HR side of things. I was also building the content on social which eventually led to learning how to build landing pages with WordPress that would allow us to capture prospects.

I learned a lot here. Not much about development but how business works and what actually matters to an employer.

How this would be relevant in tech

My twitter feed is essentially a tech echo chamber. I see people arguing about the right way to build things. From a developers perspective, many of these arguments go deeper than knowledge on the topic goes.

This role has given me the ability to evaluate things from an employers perspective. Sometimes it really doesn't matter what the perfect way to build something is, as long as it gets done properly and we do a good job. With good management, there is always a reason to do something. Every policy and process was probably built from a situation or problem that occurred, just like every project is done a certain way.

What I took away

I've never worked in a non-profit but in business, we need to balance quality with getting stuff done. I've got a pretty good perspective on the importance of productivity and how to manage clients

What my employer saw

The ability to rationalize their decisions made and seeing the perspective on the other side table was pretty valuable to them. There is nothing better than having an employee who's invested in the company - not just for a paycheck but for growth and success.

You're underestimating the soft skills

Knowing the technology you're going to be working with obviously has its advantages, but the good employers are going beyond those hard tech skills or languages you need to know and finding the right fit for the team and the role.

The military for example will have a pretty good idea of what career path you will excel in based on an aptitude test. They don't expect navy seals to have any of those skills already, they're banking on the fact that they can train the right people the methods that work best for the military.

How this changes things for you.

Now, on to the most important part. When you think of your previous experience, don't think about what you did at your job, think about what it taught you.

Learn how to sell your skills

Take some time, the same amount of time you put into coding and programming for a few days and figure out exactly how your previous skills can benefit an employer above and beyond knowing the technology.

DEV Community: Nathan Jeffrey

Building with Industry 4.0

Transitioning To SASS - A Beginners Guide.

*SASS enters

What is SASS?

What we'll cover here

Specifically, SCSS

$variables

@mixins

_partials

...and more

SCSS - Sassy!

$variables

@mixins

_partials

What else?

Nesting

Inheritance

Operators

Functions

A few minor features I frequent

Why You're More Qualified Than You Think In Tech.

How seemingly irrelevant experience can lead to your first developer role.

My Experience

Mechanic

How this would be relevant in tech

What I took away

What my employer saw

Entrepreneur

How this would be relevant in tech

What I took away

What my employer saw

You're underestimating the soft skills

How this changes things for you.

Learn how to sell your skills

You're more valuable than you think.