DEV Community: Johnny Boy

Learnings from a Manager's Past: Part 1 - Diving In

Johnny Boy — Sun, 30 Mar 2025 17:14:03 +0000

Learnings from a Manager's Past: Part 1 - Diving In

Context

Look, I'm not managing people anymore. That chapter of my life closed around early 2022. It was only a five-year stint, but man, those years were packed with lessons. I wanted to jot down some of the stuff I learned, the experiences and learnings, just to have it somewhere. I'll try to keep it in order... as best as I remember.

Before the Real Deal

I've been coding since 2008-2009. Got promoted to Senior Software Engineer quickly, then to Lead Software Engineer by 2011. The new title sounded fancy, but it was mostly just me keeping tabs on one other person, technically speaking. Planning features, writing stories, tracking progress—stuff I was already doing for my own projects. So, I don't really count that as "management." For me, it only started when I got my first proper direct report.

The First Step: Into the Deep End

When: Q4 2017
People Managed: One

There I was, happy as a clam, thinking I'd just keep coding away, when my boss drops this on me: "How about you take over the Engineering Manager role?" Or whatever the title was, some "Lead of Technical Squad" thing. I was like, "Wait, what?"

So, I ask about the responsibilities, and he kinda... glossed over it. Said it was basically what I was doing, plus one direct report. Looking back, he played it smart. If he'd laid it all out, I probably would've said no thanks. I was all about the individual contributor and hard skills life.

Anyway, they'd already hired someone for my "team," which meant I missed the opportunity to interview the guy. Big rookie mistake. As any manager knows nowadays, hiring the right people is half the battle.

One clear memory I got from this position is this one time, we're hashing out the design for an abandoned-cart feature. My direct says, "You need to listen to my ideas." It threw me for a loop. I was used to just talking code. But he was right, he needed to feel heard. I listened, even though I knew his approach wouldn't work. Thing is, he felt dismissed.

Learning: "You gotta listen, really listen, weigh things up, and explain your reasoning. To your team, to anyone."

That was a wake-up call. I started reading up on management, realizing how many good engineers get stuck with bad managers. It's a real problem. And being a manager? It's way more than just telling people what to do. It's managing work, careers, expectations, your own sanity, office politics, how you talk... the whole enchilada.

Around then, I got to do some interviews, hire someone myself. That was cool. Finding someone who clicked with me and my direct? That felt like a win.

Improve your React skills with these 5 tips

Johnny Boy — Sun, 26 Apr 2020 23:36:13 +0000

Summary

We will go through a piece of Javascript code that we have all seen(or eventually will see) in some of our careers. And I will try to make some improvements and I will provide some arguments on why I make them. I hope you find this helpful!

The scene of the crime

function Othercomponent({ children, props }) {
  return <div {...props}>{children}</div>;
}
const MyComponent = ({
  id,
  text,
  style,
  extraProps,
  oneList,
  containerOfThings,
  aType,
}) => {
  const whichString = aType == "SomeString" ? "aString" : "bString";
  const whichNumber = aType == "SomeString" ? 123 : 321;
  const extraThing = "Hey! I am a string";
  if (containerOfThings && oneList && oneList.length > 1) {
    return (
      <ul>
        <Othercomponent
          whichString={whichString}
          whichNumber={whichNumber}
          id={id}
          style={style}
          extraProps={extraProps}
          alt={oneList[0]}
          extraThing={extraThing}
        >
          {text}
        </Othercomponent>
        <Othercomponent
          whichString={whichString}
          whichNumber={whichNumber}
          id={id}
          style={style}
          extraProps={extraProps}
          alt={oneList[1]}
          extraThing={extraThing}
        >
          {text}
        </Othercomponent>
        <Othercomponent
          whichString={whichString}
          whichNumber={whichNumber}
          id={id}
          style={style}
          extraProps={extraProps}
          alt={oneList[2]}
          extraThing={extraThing}
        >
          {text}
        </Othercomponent>
      </ul>
    );
  } else {
    return (
      <Othercomponent
        whichString={whichString}
        whichNumber={whichNumber}
        id={id}
        style={style}
        extraProps={extraProps}
        extraThing={extraThing}
        alt={text}
      >
        {text}
      </Othercomponent>
    );
  }
  return <></>;
};

const MyApp = (props) => (
  <MyComponent id={123} aType={"SomeString"} text="some content" {...props} />
);

Ok... bear with me now. I know it is ugly. Let us try to make it better one step at the time.

#1 Stay consistent

In the first component(<Othercomponent/>) we are declaring our component in the way: function XXXXX() { /* ... */ } and not in a PascalCase. While in the second component(<MyComponent/>) we are using arrow functions and PascalCase. It is important to stay consistent across your codebase so when you start to create another component you don't have to question yourself or your teammates on what is the right way to define my components. If you have a consistent codebase it allows your fellow developers to make better assumptions on what's the current state and rules followed, liberating from questioning every single step of the way while implementing code around an existing piece of code.

From:

function Othercomponent({ children, props }) {
  return <div {...props}>{children}</div>;
}

To:

const OtherComponent = ({ children, props }) => {
  return <div {...props}>{children}</div>;
};

Result:

const OtherComponent = ({ children, props }) => {
  return <div {...props}>{children}</div>;
};

const MyComponent = ({
  id,
  text,
  style,
  extraProps,
  oneList,
  containerOfThings,
  aType,
}) => {
  const whichString = aType == "SomeString" ? "aString" : "bString";
  const whichNumber = aType == "SomeString" ? 123 : 321;
  const extraThing = "Hey! I am a string";
  if (containerOfThings && oneList && oneList.length > 1) {
    return (
      <ul>
        <OtherComponent
          whichString={whichString}
          whichNumber={whichNumber}
          id={id}
          style={style}
          extraProps={extraProps}
          alt={oneList[0]}
          extraThing={extraThing}
        >
          {text}
        </OtherComponent>
        <OtherComponent
          whichString={whichString}
          whichNumber={whichNumber}
          id={id}
          style={style}
          extraProps={extraProps}
          alt={oneList[1]}
          extraThing={extraThing}
        >
          {text}
        </OtherComponent>
        <OtherComponent
          whichString={whichString}
          whichNumber={whichNumber}
          id={id}
          style={style}
          extraProps={extraProps}
          alt={oneList[2]}
          extraThing={extraThing}
        >
          {text}
        </OtherComponent>
      </ul>
    );
  } else {
    return (
      <OtherComponent
        whichString={whichString}
        whichNumber={whichNumber}
        id={id}
        style={style}
        extraProps={extraProps}
        extraThing={extraThing}
        alt={text}
      >
        {text}
      </OtherComponent>
    );
  }
  return <></>;
};

const MyApp = (props) => (
  <MyComponent id={123} aType={"SomeString"} text="some content" {...props} />
);

#2 Leverage the language/framework features

One incredibly common thing I've seen recently when doing code reviews for Frontend Engineers is that we are no longer familiar with the features that the framework or the syntactic sugar the language offers.

Children as props

We know that everything you write inside a React component is a children and children are passed as props(you can send them inside or with the children={'my child'} prop). So we can always leverage this when we are implementing our components.

No return statement

We can make use of the JS feature of the one-liner functions, that don't need any return keyword. Please use the features that the good people working on them! https://github.com/tc39/proposals

From:

const OtherComponent = (props) => {
  return <div {...props} />;
};


const MyComponent = ({
  id,
  text,
  style,
  extraProps,
  oneList,
  containerOfThings,
  aType,
}) => {
  // ..
        <OtherComponent
          whichString={whichString}
          whichNumber={whichNumber}
          id={id}
          style={style}
          extraProps={extraProps}
          alt={oneList[0]}
          extraThing={extraThing}
        >
          {text}
        </OtherComponent>
  // ...

To:

const OtherComponent = (props) => <div {...props} />;

const MyComponent = ({
  id,
  children,
  style,
  extraProps,
  oneList,
  containerOfThings,
  aType,
}) => {
  // ...
        <OtherComponent
          whichString={whichString}
          whichNumber={whichNumber}
          id={id}
          style={style}
          extraProps={extraProps}
          alt={oneList[0]}
          extraThing={extraThing}
        >
          {children}
        </OtherComponent>
  // ...

Result:

const OtherComponent = (props) => <div {...props} />;

const MyComponent = ({
  id,
  children,
  style,
  extraProps,
  oneList,
  containerOfThings,
  aType,
}) => {
  const whichString = aType == "SomeString" ? "aString" : "bString";
  const whichNumber = aType == "SomeString" ? 123 : 321;
  const extraThing = "Hey! I am a string";
  if (containerOfThings && oneList && oneList.length > 1) {
    return (
      <ul>
        <OtherComponent
          whichString={whichString}
          whichNumber={whichNumber}
          id={id}
          style={style}
          extraProps={extraProps}
          alt={oneList[0]}
          extraThing={extraThing}
        >
          {children}
        </OtherComponent>
        <OtherComponent
          whichString={whichString}
          whichNumber={whichNumber}
          id={id}
          style={style}
          extraProps={extraProps}
          alt={oneList[1]}
          extraThing={extraThing}
        >
          {children}
        </OtherComponent>
        <OtherComponent
          whichString={whichString}
          whichNumber={whichNumber}
          id={id}
          style={style}
          extraProps={extraProps}
          alt={oneList[2]}
          extraThing={extraThing}
        >
          {children}
        </OtherComponent>
      </ul>
    );
  } else {
    return (
      <OtherComponent
        whichString={whichString}
        whichNumber={whichNumber}
        id={id}
        style={style}
        extraProps={extraProps}
        extraThing={extraThing}
        alt={children}
      >
        {children}
      </OtherComponent>
    );
  }
  return <></>;
};

const MyApp = (props) => (
  <MyComponent id={123} aType={"SomeString"} {...props}>
    some content
  </MyComponent>
);

#3 Being explicit without reason

Some people like to argue that we should always be explicit. That every single component should have all the props deconstructed. I understand that this approach is desirable in some scenarios, but in most cases is just noise to the code. If you have this need, please consider moving to Typescript(or if you just want to make better JS code in general). In our example we can make a lot of things implicit because we are deconstructing some variables that we never touch and we don't care.

From:

// ...
const MyComponent = ({
  id,
  children,
  style,
  extraProps,
  oneList,
  containerOfThings,
  aType,
}) => {
  // ...
  <OtherComponent
    whichString={whichString}
    whichNumber={whichNumber}
    id={id}
    style={style}
    extraProps={extraProps}
    alt={oneList[0]}
    extraThing={extraThing}
  >
    {children}
  </OtherComponent>

To:

// ...
const MyComponent = ({ oneList, containerOfThings, aType, ...props }) => {
  // ...
  <OtherComponent
    whichString={whichString}
    whichNumber={whichNumber}
    alt={oneList[0]}
    extraThing={extraThing}
    {...props}
  />

Result:

const OtherComponent = (props) => <div {...props} />;

const MyComponent = ({ oneList, containerOfThings, aType, ...props }) => {
  const whichString = aType == "SomeString" ? "aString" : "bString";
  const whichNumber = aType == "SomeString" ? 123 : 321;
  const extraThing = "Hey! I am a string";
  if (containerOfThings && oneList && oneList.length > 1) {
    return (
      <ul>
        <OtherComponent
          whichString={whichString}
          whichNumber={whichNumber}
          alt={oneList[0]}
          extraThing={extraThing}
          {...props}
        />
        <OtherComponent
          whichString={whichString}
          whichNumber={whichNumber}
          alt={oneList[1]}
          extraThing={extraThing}
          {...props}
        />
        <OtherComponent
          whichString={whichString}
          whichNumber={whichNumber}
          alt={oneList[2]}
          extraThing={extraThing}
          {...props}
        />
      </ul>
    );
  } else {
    return (
      <OtherComponent
        whichString={whichString}
        whichNumber={whichNumber}
        alt={oneList[0]}
        extraThing={extraThing}
        {...props}
      />
    );
  }
  return <></>;
};

const MyApp = (props) => (
  <MyComponent
    id={123}
    aType={"SomeString"}
    {...props}
    containerOfThings={true}
    oneList={["alt1", "alt2", "alt3"]}
  >
    some content
  </MyComponent>
);

#4 Reduce Logical branches / Make your code less error prone

We all love ternaries and unnecessary variables, I get it. I've fallen into this trap, where you want to make something work and then you decide that checking with an if or assigning a value with a ternary is the solution. Most of the time is not. It just increase the time you will spend on reaching full/good test coverage of your code.

When we add those logical branches once in a while we make dumb mistakes such a code that is unreachable or we make our code more complex than it should.

Remove the ternary if

One nifty trick that you should use to reduce logical branches from ternary ifs is the usage of maps(you can also call them hashes/objects). You can think of them as some configuration helpers. 😇

From:

// ...
const whichString = aType == "SomeString" ? "aString" : "bString";
const whichNumber = aType == "SomeString" ? 123 : 321;
// ...
<OtherComponent
  whichString={whichString}
  whichNumber={whichNumber}
  alt={oneList[0]}
  extraThing={extraThing}
  {...props}
/>;
// ...

To:

// ...
const valuesMap = {
  SomeString: { str: "aString", num: 123 },
  OtherString: { str: "bString", num: 321 },
};
// ...
<OtherComponent
  whichString={valuesMap[aType].str}
  whichNumber={valuesMap[aType].num}
  alt={oneList[0]}
  extraThing={extraThing}
  {...props}
/>;
// ...

Result:

const OtherComponent = (props) => <div {...props} />;

const MyComponent = ({ oneList, containerOfThings, aType, ...props }) => {
  const valuesMap = {
    SomeString: { str: "aString", num: 123 },
    OtherString: { str: "bString", num: 321 },
  };
  const extraThing = "Hey! I am a string";
  if (containerOfThings && oneList && oneList.length > 1) {
    return (
      <ul>
        <OtherComponent
          whichString={valuesMap[aType].str}
          whichNumber={valuesMap[aType].num}
          alt={oneList[0]}
          extraThing={extraThing}
          {...props}
        />
        <OtherComponent
          whichString={valuesMap[aType].str}
          whichNumber={valuesMap[aType].num}
          alt={oneList[1]}
          extraThing={extraThing}
          {...props}
        />
        <OtherComponent
          whichString={valuesMap[aType].str}
          whichNumber={valuesMap[aType].num}
          alt={oneList[2]}
          extraThing={extraThing}
          {...props}
        />
      </ul>
    );
  } else {
    return (
      <OtherComponent
        whichString={valuesMap[aType].str}
        whichNumber={valuesMap[aType].num}
        alt={oneList[0]}
        extraThing={extraThing}
        {...props}
      />
    );
  }
  return <></>;
};

const MyApp = (props) => (
  <MyComponent
    id={123}
    aType={"SomeString"}
    {...props}
    containerOfThings={true}
    oneList={["alt1", "alt2", "alt3"]}
  >
    some content
  </MyComponent>
);

Remove complexity, remove the conditionals

It has been some years now that the Functional Programming(FP) paradigm has been around and re-hyped. So the time has come for you to stop using ifs and improve the quality of your code.

In this example we can see that there is unnecessary return, and the example is pretty dumb or obvious but I guarantee you will read or have read some code with conditions that are useless.

Now if we can work around having the same html structure for all the scenarios, it will make your code ridiculously simple. You might need to improve your CSS skills if you don't see a clear way on doing this.

Result:

const OtherComponent = (props) => <div {...props} />;

const MyComponent = ({ oneList = [], aType, ...props }) => {
  const valuesMap = {
    SomeString: { str: "aString", num: 123 },
    OtherString: { str: "bString", num: 321 },
  };
  const extraThing = "Hey! I am a string";
  return (
    <ul>
      {oneList.map((item) => (
        <OtherComponent
          whichString={valuesMap[aType].str}
          whichNumber={valuesMap[aType].num}
          alt={item}
          key={item}
          extraThing={extraThing}
          {...props}
        />
      ))}
    </ul>
  );
};

const MyApp = (props) => (
  <MyComponent
    id={123}
    aType={"SomeString"}
    {...props}
    containerOfThings={true}
    oneList={["alt1", "alt2", "alt3"]}
  >
    some content
  </MyComponent>
);

#5 Constants in your React Apps

My last advice for this article is this: Check your Constants!

Always make sure to leave them outside your React Components, you don't need to redeclare them every time the component is called. Also use set default values for your props, you will save some time by letting everyone know which is the default behavior of your component.

Result:

const STRING_TYPES = { SomeString: "SomeString", OtherString: "OtherString" };

const valuesMap = {
  SomeString: { whichString: "aString", whichNumber: 123 },
  OtherString: { whichString: "bString", whichNumber: 321 },
};

const extraThing = "Hey! I am a string";

const OtherComponent = (props) => <div {...props} />;

const MyComponent = ({
  aType = STRING_TYPES.SomeString,
  oneList = [],
  ...props
}) => (
  <ul>
    {oneList.map((item) => (
      <OtherComponent
        alt={item}
        key={item}
        extraThing={extraThing}
        {...valuesMap[aType]}
        {...props}
      />
    ))}
  </ul>
);

const MyApp = (props) => (
  <MyComponent
    id={123}
    aType={STRING_TYPES.SomeString}
    containerOfThings={true}
    oneList={["alt1", "alt2", "alt3"]}
    {...props}
  >
    some content
  </MyComponent>
);

The end!

I hope this helps you guys!

Cheers, stay safe!

GraphQL + Kotlin & Spring Boot - Part 2 - CRUD Operations

Johnny Boy — Mon, 06 Apr 2020 00:18:37 +0000

Summary

Hey people! Today we are going to continue our Kotlin with GraphQL tutorials.
We are going to take as a code base https://github.com/Grekz/example-kotlin-crud that we did in our previous post here.

Test that the base code works

First let us make sure that you have everything ready. Input these command:

$ docker run --rm --name test-mysql -p 3306:3306 -e MYSQL_ROOT_PASSWORD=123456 -e MYSQL_DATABASE=kotlin_crud_db -d mysql:latest
$ gradle bootRun

If you have trouble running it, make sure to follow the previous post.

Update the TaskService.kt file

First of all we need to do some changes in our TaskService, to reuse most of the code in our GraphQL Resolvers.

// .../kotlin/com/grekz/crudKotlin/service/TaskService.kt
package com.grekz.crudKotlin.service

import com.grekz.crudKotlin.model.Task
import com.grekz.crudKotlin.repository.TaskRepository
import org.springframework.stereotype.Service
import java.util.*

@Service
class TaskService(private val taskRepository: TaskRepository) {

  fun getTasks(): List<Task> =
    taskRepository.findAll()

  fun addTask(task: Task): Task = taskRepository.save(task)

  fun getTaskById(taskId: Long): Optional<Task> =
    taskRepository.findById(taskId)

  fun putTask(taskId: Long, newTask: Task): Optional<Task> =
    taskRepository.findById(taskId).map { currentTask ->
      val updatedTask: Task =
        currentTask
          .copy(
            title = newTask.title,
            description = newTask.description,
            status = newTask.status,
            startDate = newTask.startDate,
            priority = newTask.priority,
            dueDate = newTask.dueDate
          )
      taskRepository.save(updatedTask)
    }

  fun deleteTask(taskId: Long): Boolean =
    taskRepository.findById(taskId).map { task ->
      taskRepository.delete(task)
      true
    }.orElse(false)
}

Extra points... Update your TaskResource.kt

If you want to continue providing a RESTful API, we need to update the tasks resources:

package com.grekz.crudKotlin.resource

import com.grekz.crudKotlin.model.Task
import com.grekz.crudKotlin.service.TaskService
import org.springframework.http.HttpStatus
import org.springframework.http.ResponseEntity
import org.springframework.web.bind.annotation.*
import javax.validation.Valid

@RestController
@RequestMapping("/v1/api/tasks")
class TaskResource(private val taskService: TaskService) {

  @GetMapping
  fun getTasks(): List<Task> =
    taskService.getTasks()

  @PostMapping
  fun addTask(@Valid @RequestBody task: Task): ResponseEntity<Task> =
    ResponseEntity.ok(taskService.addTask(task))

  @GetMapping("/{id}")
  fun getTaskById(@PathVariable(value = "id") taskId: Long): ResponseEntity<Task> =
    taskService.getTaskById(taskId).map { task ->
      ResponseEntity.ok(task)
    }.orElse(ResponseEntity.notFound().build())

  @PutMapping("/{id}")
  fun updateTaskById(
    @PathVariable(value = "id") taskId: Long,
    @Valid @RequestBody newTask: Task): ResponseEntity<Task> =
    taskService.putTask(taskId, newTask)
      .map { task -> ResponseEntity.ok().body(task) }
      .orElse(ResponseEntity.notFound().build())

  @DeleteMapping("/{id}")
  fun deleteTask(@PathVariable(value = "id") taskId: Long): ResponseEntity<Void> =
    if (taskService.deleteTask(taskId))
      ResponseEntity<Void>(HttpStatus.ACCEPTED)
    else
      ResponseEntity.notFound().build()
}

Update the application yaml file

## ../resources/application.yml
## ... Previous config ...
graphql:
  servlet:
    mapping: /graphql
    enabled: true
    corsEnabled: true
graphiql:
  mapping: /graphiql
  endpoint: /graphql
  enabled: true
  pageTitle: GraphiQL
  cdn:
    enabled: false
    version: 0.11.11

Update your build.gradle.kts

// ... Previous config ...

dependencies {
    implementation("com.graphql-java:graphql-java-extended-scalars:1.0.1")
    implementation("com.graphql-java:graphql-spring-boot-starter:5.0.2")
    implementation("com.graphql-java:graphiql-spring-boot-starter:5.0.2")
    implementation("com.graphql-java:voyager-spring-boot-starter:5.0.2")
    implementation("com.graphql-java:graphql-java-tools:5.2.4")
    // ... Rest of the dependencied ...
}

Add your GraphQL Schema

File: ../resources/schema.graphqls

type Query {
  getTasks: [Task]
  getTaskById(taskId: ID!): Task
}

type Mutation {
  createTask(
    title: String
    description: String
    status: Int
    priority: Int
  ): Task
  updateTask(
    taskId: Long!
    title: String
    description: String
    status: Int
    priority: Int
  ): Task
  deleteTask(taskId: Long!): Boolean
}

type Task {
  id: Long
  title: String
  description: String
  status: Int
  priority: Int
}

Add the resolvers

We need to tell the application how to handle the graphql requests. For queries and mutations.
Query Resolver:

// .../kotlin/com/grekz/crudKotlin/resolver/QueryResolver.kt
package com.grekz.crudKotlin.resolver

import com.coxautodev.graphql.tools.GraphQLQueryResolver
import com.grekz.crudKotlin.model.Task
import com.grekz.crudKotlin.service.TaskService
import org.springframework.stereotype.Component

@Component
class QueryResolver (private val taskService: TaskService) : GraphQLQueryResolver {
  fun getTasks(): List<Task> = taskService.getTasks()
  fun getTaskById(taskId: Long): Task = taskService.getTaskById(taskId).orElse(null)
}

Mutation Resolver:

// ../kotlin/com/grekz/crudKotlin/resolver/MutationResolver.kt
package com.grekz.crudKotlin.resolver

import com.coxautodev.graphql.tools.GraphQLMutationResolver
import com.grekz.crudKotlin.model.Task
import com.grekz.crudKotlin.service.TaskService
import org.springframework.stereotype.Component

@Component
class MutationResolver (private val taskService: TaskService) : GraphQLMutationResolver {
  fun createTask(title: String, description: String, status: Int, priority: Int): Task =
    taskService.addTask(
      Task(
        title = title,
        description = description,
        status = status,
        priority = priority
      )
    )

  fun updateTask(taskId: Long, title: String, description: String, status: Int, priority: Int): Task =
    taskService.putTask(
      taskId,
      Task(
        id = taskId,
        title = title,
        description = description,
        status = status,
        priority = priority
      )
    ).orElse(null)

  fun deleteTask(taskId: Long): Boolean = taskService.deleteTask(taskId)
}

It's all good and dandy... but just take me to the code!

Alright, if you just want to run the project you can get it in this repo: https://github.com/Grekz/example-kotlin-crud-graphql

How to test it?

CRUD tests:
Now you can test your changes on your API and go to the Graph_i_QL http://localhost:8080/graphiql

Create:

mutation {
  createTask(
    title: "He is cool Update"
    description: "asdas"
    status: 1
    priority: 2
  ) {
    id
    title
    description
    status
  }
}

Read:
All tasks

query {
  getTasks {
    id
    title
    description
    status
    priority
  }
}

Or task by ID

query {
  getTaskById(taskId: 1) {
    id
    title
    description
    status
    priority
  }
}

Update:

mutation {
  updateTask(
    taskId: 4
    title: "He is cool Update"
    description: "asdas"
    status: 1
    priority: 2
  ) {
    id
    title
    description
    status
  }
}

Delete:

mutation {
  deleteTask(taskId: 4)
}

Cheers!
I hope this helps you get your CRUD graphQL API up and running.
Let me know if you have some feedback!

What's your leadership style and why you should care!

Johnny Boy — Sun, 29 Mar 2020 20:03:45 +0000

Summary

In this article we will try to give you some reasons on why you should know what is your leadership style.
Also we will go through the different leadership styles defined by Daniel Goleman (Commanding, Pacesetting, Visionary, Affiliative, Democratic and Coaching) and in which situations these styles are best suited to use.
At the end we hope you are able to identify what's you leadership style and when to use a different style based on the situation.

Why knowing my leadership style is important?

Your leadership style depends on many factors such as: your level of emotional intelligence, experience, communication style, decision making, etc. Every style has its own benefits and drawbacks. It's important to know our style in order to be aware of how are we impacting our team members and our results with our current style.

Remember, as the great Uncle Ben once said, with great power comes great responsibility. You own to your team members and followers to be the best possible leader you can!

Commanding: "Do it because I say so"

This leadership style is also known as: Autocratic, Directive, Coercive.

The Commanding Leader unilaterally takes complete control of the situation, dictates what and how is something going to be done and assumes the responsibility entirely.

This style is not recommended to be used long-term, but it can be useful when confronting a crisis or when dealing with problematic people.

Objective: Immediate compliance.

Pacesetting: "Do it my way"

The Pacesetting Leader focuses on reaching goals and performance. This Leader expects excellence from the team and the leader could sometimes jump in to make sure the goals are met.

We could use this style when we need some quick results, but is doesn't create a great environment in the long-run.

Objective: Accomplishing tasks with a high standard.

Visionary: "Let’s remind ourselves of the larger purpose"

Also known as Authoritative.

The Visionary Leader provides a long-term direction and vision for the team. They inspire their teams with the goals and let their teams the task to define how to achieve those goals.

Your team can benefit from this style of leadership when there is a need for a change of direction or when inspiration is needed.

Objective: To inspire and mobilize others towards a vision.

Affiliative: "People first, task second"

The Affiliative Leader is focused on creating good relationship and promoting harmony within the team. This Leader puts more emphasis on the people than the tasks in hand.

This style really beneficial when you are forming a new team, or when trust within the team has been broken.

Objective: To create harmony between team members.

Democratic: "Let’s work it out together"

The Democratic Leader reaches decisions by consensus and trust the team to define the appropriate direction for themselves and the team. This Leader listens to all their concerns and promotes discussions where all the team can participate.

We can benefit a lot from this type of leadership when we the team knows what they are doing and when we need to have more commitment from all the team members.

Objective: Collaboration, commitment and generating new ideas.

Coaching: "Let me help you develop"

The Coaching Leader provides constant challenges, feedback and support for the team members. The leader helps identify the team members aspirations and tries to align them with the organization's goals.

Usage of this style can be beneficial when an employee needs to improve their skill set or performance. Also when trying to help the team member long-term strengths.

Objective: Developing people for the long-term.

Some questions for you!

If you were in your ideal team/situation, which style would you use? Why?
Which style did you use recently? Is it the same answer as the previous question?
Which style did your boss use?
Which style would you like to use more?

Stay safe, Cheers!

References

https://hbr.org/2000/03/leadership-that-gets-results

https://www.bfwh.nhs.uk/onehr/wp-content/uploads/2016/02/Leadership-Styles-V1.pdf

https://intranet.ecu.edu.au/__data/assets/pdf_file/0006/755637/Six-Emotional-Leadership-Styles.pdf

http://www.microlearnings.eu/application/files/2514/9196/4973/EN_Clip_3_Golemans_Six_Leadership_styles.pdf

Create a REST api with Kotlin + SpringBoot + JPA + Flyway

Johnny Boy — Mon, 23 Mar 2020 01:34:50 +0000

Summary

It has been some time since I have used a Spring Boot repository and I thought today would be a good day to refresh this knowledge while I get to play around with Flyway.
In this tutorial we will learn how to create a small Spring Boot application using a JPA Repository and having Flyway to help us with the migrations.
All of this using this fun (see the reserved words for functions) language called Kotlin.

Prerequisites

To follow this tutorial is necessary that you have installed Java, Kotlin and Gradle.
You can learn how to do it in this post.
Excellent! Now that you have what is needed, let's continue.

Getting SpringBoot

You can get it with your vscode extension or from the Spring Initializr page.
Make sure to select the next dependencies:

Spring Web
Spring Data JPA
Spring DevTools
Flyway Migration
MySQL Driver

After you download the generated zip file, unpack it and you can continue with the tutorial.
if you have some doubts on how to get your project going you can check out this post.

Setting up your database

In order to persist our information we are going to use Docker. In case that you don't have this great tool already installed, you can check their website and follow the steps to install.

Now that you have docker installed, you can input this command in your terminal:

docker run --rm --name test-mysql -p 3306:3306 -e MYSQL_ROOT_PASSWORD=123456 -e MYSQL_DATABASE=kotlin_crud_db -d mysql:latest

After the previous step is completed we need to go to our folder, the one that we unzipped, that contains the Spring Boot application we just downloaded. And identify the application.properties file.

We will rename this file to application.yml and its content should be:

## content of /src/main/resources/application.yml
spring:
  datasource:
    url: &dbURL jdbc:mysql://localhost:3306/kotlin_crud_db
    username: &dbUser root
    password: &dbPassword 123456
  jpa:
    properties:
      hibernate:
        dialect: org.hibernate.dialect.MySQL5InnoDBDialect
    hibernate:
      ddl-auto: update

Now we have configured our data source. To make sure we have everything running, let us go back to our terminal and type the next command:

gradle bootRun

Now you should see that in your terminal there was no error, and the spring boot app should be EXECUTING

Create Flyway migrations

Now we need to create some migration scripts so they get run by Flyway.
In the folder /src/main/resources/db/migration/ we'll create a file called V1__CreateTableTasks.sql with content:

CREATE TABLE IF NOT EXISTS tasks(
    id BIGINT(19) AUTO_INCREMENT PRIMARY KEY,
    title VARCHAR(255) NOT NULL,
    start_date DATE,
    due_date DATE,
    status TINYINT NOT NULL,
    priority TINYINT NOT NULL,
    description TEXT,
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
    updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
)  ENGINE=INNODB;

And we are going to create another script, in the same folder, called V2__TestData.sql:

insert into tasks(title, status, priority, description) values ('First Task', 1, 1, 'My first task description');
insert into tasks(title, status, priority, description) values ('Another Task', 2, 2, 'Another task description');

Now let's run the command:

gradle bootRun

If you want to check what happened in the Database, you can run the following commands:

docker exec -it test-mysql mysql -u root -p

You'll get prompted Enter password: and you need to input 123456 if you are following the tutorial exactly.
When you are inside the container you should see mysql>. Now you can type the next command:

mysql> use kotlin_crud_db;
mysql> select * from tasks;
mysql> select * from flyway_schema_history;

Create the model

Now let's create a folder in /src/main/kotlin/com/example/demo which is gonna be called model.
And we are going to create a new Kotlin data class called Task:

package com.example.demo.model

import java.time.LocalDateTime
import java.util.*
import javax.persistence.*

@Entity
@Table(name = "tasks")
data class Task(
        @Id
        @GeneratedValue(strategy = GenerationType.IDENTITY)
        val id: Long? = null,
        val title: String,
        val description: String? = null,
        val startDate: Date? = null,
        val dueDate: Date? = null,
        val status: Int,
        val priority: Int,
        val createdAt: LocalDateTime? = LocalDateTime.now(),
        val updatedAt: LocalDateTime? = LocalDateTime.now()
)

Create the JPA Repository

Now we need to create a JPA Repository where we are going to declare the TaskRepository Interface, this is going to exist in /src/main/kotlin/com/example/demo/repository/TaskRepository.kt:

package com.example.demo.repository

import com.example.demo.model.Task
import org.springframework.data.jpa.repository.JpaRepository
import org.springframework.stereotype.Repository
import javax.transaction.Transactional

@Repository
@Transactional(Transactional.TxType.MANDATORY)
interface TaskRepository : JpaRepository<Task, Long>

This will help us to handle all the interactions with the database for this tutorial. We are not going to write a single line of code to configure or to read anything from the database, besides the things we've already done.

Create the service

After the Repository is created, now we need to create our Service that will be the layer where we are going to communicate our Resource with our Repository.
We will create a file in /src/main/kotlin/com/example/demo/service/TaskService.kt:

package com.example.demo.service

import com.example.demo.model.Task
import com.example.demo.repository.TaskRepository
import org.springframework.http.HttpStatus
import org.springframework.http.ResponseEntity
import org.springframework.stereotype.Service

@Service
class TaskService(private val taskRepository: TaskRepository) {

  fun getTasks(): List<Task> =
    taskRepository.findAll()

  fun addTask(task: Task): ResponseEntity<Task> =
    ResponseEntity.ok(taskRepository.save(task))

  fun getTaskById(taskId: Long): ResponseEntity<Task> =
    taskRepository.findById(taskId).map { task ->
      ResponseEntity.ok(task)
    }.orElse(ResponseEntity.notFound().build())

  fun putTask(taskId: Long, newTask: Task): ResponseEntity<Task> =
    taskRepository.findById(taskId).map { currentTask ->
      val updatedTask: Task =
        currentTask
          .copy(
            title = newTask.title,
            description = newTask.description,
            status = newTask.status,
            startDate = newTask.startDate,
            priority = newTask.priority,
            dueDate = newTask.dueDate
          )
      ResponseEntity.ok().body(taskRepository.save(updatedTask))
    }.orElse(ResponseEntity.notFound().build())

  fun deleteTask(taskId: Long): ResponseEntity<Void> =
    taskRepository.findById(taskId).map { task ->
      taskRepository.delete(task)
      ResponseEntity<Void>(HttpStatus.ACCEPTED)
    }.orElse(ResponseEntity.notFound().build())
}

Create the resource (controller)

After creating the service we are going to tell the applcation how to map the different HTTP methods (GET, POST, PUT, DELETE).
In the file /src/main/kotlin/com/example/demo/resource/TaskResource.kt:

package com.example.demo.resource

import com.example.demo.model.Task
import com.example.demo.service.TaskService
import org.springframework.http.HttpStatus
import org.springframework.http.ResponseEntity
import org.springframework.web.bind.annotation.*
import javax.validation.Valid

@RestController
@RequestMapping("/v1/api/tasks")
class TaskResource(private val taskService: TaskService) {

  @GetMapping
  fun getTasks(): List<Task> =
    taskService.getTasks()

  @PostMapping
  fun addTask(@Valid @RequestBody task: Task): ResponseEntity<Task> =
    taskService.addTask(task)

  @GetMapping("/{id}")
  fun getTaskById(@PathVariable(value="id") taskId: Long): ResponseEntity<Task> =
    taskService.getTaskById(taskId)

  @PutMapping("/{id}")
  fun updateTaskById(
    @PathVariable(value = "id") taskId: Long,
    @Valid @RequestBody newTask: Task): ResponseEntity<Task> =
    taskService.putTask(taskId, newTask)

  @DeleteMapping("/{id}")
  fun deleteTask(@PathVariable(value = "id") taskId: Long): ResponseEntity<Void> =
    taskService.deleteTask(taskId)
}

Ok, great. Now... how do I test this?

I will probably follow up this tutorial with how to implement tests in a project.
But in the meantime you can test it with some good ol' curls:

Here we can test the get where we return all the tasks:

$ curl --location --request GET 'localhost:8080/v1/api/tasks'

With this other curl we can test retrieve one single task:

$ curl --location --request GET 'localhost:8080/v1/api/tasks/1'

Now we can test creating a new task with the following command:

$ curl --location --request POST 'localhost:8080/v1/api/tasks/' \
--header 'Content-Type: application/json' \
--data-raw '{
    "title": "new 2nd task",
    "status": 1,
    "priority": 1,
    "description":"2244 blah blah task"
}'

In case you want to update the task:

$ curl --location --request PUT 'localhost:8080/v1/api/tasks/2' \
--header 'Content-Type: application/json' \
--data-raw '{
    "title": "blah blah new 2nd task",
    "status": 1,
    "priority": 1,
    "description":"2244 blah blah task"
}'

And to delete the task that has the id=2 :

$ curl --location --request DELETE 'localhost:8080/v1/api/tasks/2'

Final source code

Just take me to the code already!
Alright my people, I hope you are staying safe in this COVID19 times.
We will get through this, hang in there.

Improve your productivity with VS Code

Johnny Boy — Mon, 16 Mar 2020 01:24:21 +0000

Plugins

GitLens
- It helps you understand a little more the piece of code you are seeing by providing you with some quick overview on who and when was updated the current line of code.
Code Spell Checker
- I use a lot this extension. I have never learnt how words are written =). And having this extension has helped me to avoid some typos on naming things. Although we know this is the hardest part of being a software engineer.
Prettier
- Another essential tool. To have all nice and tidy after you save your file. This tool will auto format your files.
Indent Rainbow
- Cool tool to see the current scope of some functions. Useful if you do not want to search with your eyes what's the scope of this function???
Turbo Console Log
- We never console.log our code I know. Just try this in case you need to save some time.
Live Server
- Great tool that allows you to start local dev server.

Keyboard Shortcuts

Shortcut	Action
Cmd + B	Hide or Show side panel.
Cmd + D	Select next occurrence of current selection.
Cmd + E	Highlights all occurrences of current selection.
Cmd + F	Search in current file.
Cmd + P	Go to File...
Cmd + M	Minimize VS Code editor.
Cmd + N	Create new file.
Cmd + S	Save current changes.
Cmd + W	Close current tab.
Cmd + 2	Open second split panel.
Cmd + Shift + L	Select all occurrences of current selection.
Cmd + Shift + F	Search: Find in files.
Cmd + Shift + K	Delete current line.
Cmd + Shift + P	Open Command palette. Here you can check all the commands that you have available.
Cmd + F2	Change all occurrences of the current selection.
Cmd + Option + arrows (up or down)	Add cursor to next or previous line.
Cmd + Option + arrows (left or right)	Move to next tab.
Cmd + arrows (left or right)	Go to the end or the beginning of the current line.
Option + arrows (left or right)	Move to next line token (spaces or dots).
Option + arrows (up or down)	Move swap lines with the next in the arrow direction.
Option + Shift + arrows (up or down)	Copy current line up or down.
Option + Shift + F	Format current document.
Esc	Remove current selection or action.
Cmd + K (release Cmd) + C	Compare current changes with previous changes.
Shift + `(backtick)	Open the terminal in your VS Code.

Custom settings.json

Customize your workspace with a color header:

  "workbench.colorCustomizations": {
    "titleBar.activeBackground": "#8bbff3",
    "titleBar.activeForeground": "#333333",
    "titleBar.inactiveForeground": "#EEEEEE"
  },

Format on save:

    "editor.formatOnSave": true,

Extra Info

Markdown cheatsheet

Start playing with RUST + Cargo

Johnny Boy — Sun, 08 Mar 2020 21:25:29 +0000

Installation

Let us start setting up our environment by following what is in the official documentation.
You can check it out in here.
We should just copy the next line and paste it in our terminal:

$ curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh

You can select the default installation option by typing 1.
After this you should go to your ~/.zshrc or ~/.bash_profile and add at the end the next line:

export PATH="$HOME/.cargo/bin:$PATH"

When you have completed this previous step, go back to your terminal and then type:

$ source ~/.zshrc

With this you will have the RUST tool available in your terminal.
You can verify the installation and that you have added the tools to your path successfully when you input:

$ rustc --version
##Output: rustc 1.41.1 (f3e1a954d 2020-02-24)

Alternative to installation.

If you just want to play with RUST without installing it in your machine, you can do it in its official playground.

Your first "Hello, World!" with RUST

Now that you have the RUST tools available in your environment, let us create a new file called hello.rs:

touch hello.rs

And inside this file we will copy and paste the following:

fn main() {
    println!("Hello, world!");
}

After we added the code inside the file, we can go back to the terminal and type:

rustc hello.rs

The result of the command will be an executable file that should output: Hello, world!.
To execute the file in MacOS you can type:

$ ./hello
## Output: Hello, world!

Using a Package Manager named Cargo

Nowadays almost every tool has its own package manager, which makes our lives way more easier than in the past. The package manager for RUST is called Cargo and you have already installed if you have followed the steps in the first section of this article.
To start using it, we will need some things:

Have a folder named src
Have a file named main.rs for applications or lib.rs for libraries.
A TOML file named Cargo.toml
Run cargo build or cargo run

if you are in a Mac you can type the following commands:

$ mkdir src
$ mv hello.rs ./src/main.rs
$ touch Cargo.toml

Inside your Cargo.toml file, you can put:

[package]
name = "hello_world"
version = "1.0.0"
authors = ["YourName <xxxxx@gmail.com>"]

Once you have written this, you can build your RUST app with:

$ cargo build

and to run it

$ cargo run

As output you must me seeing now:

    Finished dev [unoptimized + debuginfo] target(s) in 0.00s
     Running `target/debug/hello_world`
Hello, world!

Shortcut to use Cargo

If you do not want to go through the hassle of doing all of the previous step, you can use a command that cargo offers:

$ cargo new my_rust_app --bin

And Voila!
You have now the same files we've just created.

A simple function

As a natural next step, you would like to create a function.
Let's have a simple function that will sum two signed integers that each takes up to 8 bits of space.

fn sum(x:i8, y:i8) -> i8{
    x + y
}

We need to update our main.rs to print out the result from calling the new function:

fn main() {
    let a:i8 = 1;
    let b:i8 = 2;
    let mut total:i8 = sum(a,b);
    println!("a = {}, b = {}, a+b = {}", a, b, total);
    total = -100;
    println!("New total = {}", total);
}

Now run cargo run in your terminal, and you should see the beauty of rust.
Try to change some things in the main method, to see how RUST will point out the possible mistakes you have.

The RUST Book - Documentation

If you want to learn more about RUST you can check its documentation in HERE.
And about Data Types in this section of the book.

End

Hey people, I hope you like this small tutorials, and let me know if you want to learn something else or any other feedback you may have.

Cheers!

GraphQL + Kotlin & Spring Boot - Part 1

Johnny Boy — Sun, 01 Mar 2020 22:23:51 +0000

Summary

Welcome back to your humble dev.to blog! In this post I will try to give you the tools to set up a simple graphql with spring boot project. As a small disclaimer the folder structure and design patterns are not to be followed in a real application.

Prerequisites

You need to set up your local environment.
To do this we have already created a step by step guide in here.
You can check that you have installed Kotlin and JDK by typing this in your terminal:

$ kotlin -version
## output: Kotlin version 1.3.61-release-180 (JRE 13.0.2+8)
$ javac -version
## output: javac 13.0.2
$ gradle -version

Spring Boot Initializr

You can go to Spring Boot Initializr page and select the next.

Project: Gradle Project
Language: Kotlin
Spring Boot: 2.2.5
Group: com.grekz
Artifact: graphqlDemo
Dependencies: Spring Web, Spring Boot DevTools

And click in the Generate button.

Add dependencies

We need to add some dependencies necessary to have our GraphQL up and running.

// file build.gradle.kts
dependencies {
    implementation ("com.graphql-java:graphql-spring-boot-starter:5.0.2")
    implementation ("com.graphql-java:graphiql-spring-boot-starter:5.0.2")
    implementation ("com.graphql-java:voyager-spring-boot-starter:5.0.2")
    implementation ("com.graphql-java:graphql-java-tools:5.2.4")
    // ... rest of dependencies
}

Here we just added graphql, GraphiQL (A graphical interactive in-browser GraphQL IDE), Voyager (Represents your GraphQL API as an interactive graph) and utilities classes to help you with your GraphQL integrations.

Update application configuration

After updating the dependencies, we need to have a file that contains the configurations to tell our application how to behave.
You need to create a file named application.yml in your folder ./src/main/resources

# file application.yml
graphql:
  servlet:
    mapping: /graphql
    enabled: true
    corsEnabled: true
graphiql:
  mapping: /graphiql
  endpoint: /graphql
  enabled: true
  pageTitle: GraphiQL
  cdn:
    enabled: false
    version: 0.11.11

Create a data class

Now we are going to create a data class named Book, that will contain two attributes.

package com.grekz.graphqlDemo

data class Book( val id: String, val name: String )
// file: ./src/main/kotlin/com/grekz/graphqlDemo/Book.kt

Create a GraphQL query resolver

package com.grekz.graphqlDemo

import org.springframework.stereotype.Component
import com.coxautodev.graphql.tools.GraphQLQueryResolver

@Component
class BookResolver() : GraphQLQueryResolver {
    // this method name needs to be same and in the schema
    fun books(): List<Book> {
        val book1 = Book("1", "name1")
        val book2 = Book("2", "name2")
        return listOf(book1, book2)
    }
}
// file: ./src/main/kotlin/com/grekz/graphqlDemo/BookResolver.kt

Defining your schema

In GraphQL you need to specify the types and how data can be queried or mutated.
You can put the next in the file: ./src/main/resources/models.graphqls

type Query {
  books: [Book]
}

type Book {
  id: String!
  name: String!
}

Run the project!

This is all you need to have your graphql application running.
To do this you need to type the command:

$ gradle bootRun

After starting your server you can go to:
http://localhost:8080/graphiql?query=query%7B%0A%20%20books%7B%0A%20%20%20%20id%0A%20%20%7D%0A%7D

And hit the play button on the top to see the results.
Another cool thing you just did is to install Voyager. To see it running you can check: http://localhost:8080/voyager

Now that you have graphql up and running the sky is the limit!

Follow up

If you want another example on another thing you can do with GraphQL you can check this Auth0 post.

Setup your MacOS for Java Development with multiple Java Versions

Johnny Boy — Sun, 23 Feb 2020 19:29:34 +0000

Disclaimer

This is my personal preference on how to setup my local environment for Java development with different Java Versions.
Feel free to leave your suggestions if you think there is a better setup.

Getting a new Terminal

I've used iTerm2 for some years now, and I've found it pretty useful.
You can download it here in its own SITE.
After you have downloaded the zip file, you just installed, for more info you can check their FAQs.

Grabbing your Favorite Package Manager

If you have been using MacOS for a while, by now you should be familiar with Hombebrew.
To install it you can just run this command:

$ /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

Or if you prefer, you can go to their page and check the steps there.

Homebrew already installed?

In case you have installed homebrew some time before.
Remember to update your formulas with the next command:

$ brew update

Improving your shell experience

I've used ZSH and Oh My Zsh for some time. And you can install them by running this two commands.

$ brew install zsh
$ sh -c "$(curl -fsSL https://raw.github.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"

If you want to know more about, check out the Oh My Zsh site.

Managing your Java environment

When you are developing with multiple services, it is fairly common that you find yourself in the situation on having multiple java versions in your local machine. The tool that I have used in the past is jEnv.
To install this great tool in your local machine, you just need to run the following command:

$ brew install jenv

After you have installed jenv you need to make sure that this is available every time you start your computer, to do this you will need to update your ~/.zshrc with this next commands:

$ echo 'export PATH="$HOME/.jenv/bin:$PATH"' >> ~/.zshrc
$ echo 'eval "$(jenv init -)"' >> ~/.zshrc

Knowing & installing the Java versions you want

To know which versions of java you have available in homebrew you can run this:

$ brew search java

At this point in time we have available 3 java versions: java, java11 and java6. The first java formula is the latest.
To install these three java versions, you can run these commands:

$ brew cask install java
$ brew cask install java11
$ brew cask install java6

After installing this, you need to add them to the available jenv versions.

## First create the versions folder.
$ mkdir ~/.jenv/versions
## Add the versions to jenv
$ jenv add /Library/Java/JavaVirtualMachines/openjdk-13.0.2.jdk/Contents/Home
$ jenv add /Library/Java/JavaVirtualMachines/openjdk-11.0.2.jdk/Contents/Home
$ jenv add /Library/Java/JavaVirtualMachines/1.6.0.jdk/Contents/Home

Extra commands

To make easier to change the java version I use some aliases, by running these next commands you run:

$ echo 'alias refreshZsh="source ~/.zshrc"' >> ~/.zshrc
$ echo 'alias goJava13="jenv global 13.0 && refreshZsh"' >> ~/.zshrc
$ echo 'alias goJava11="jenv global 11.0 && refreshZsh"' >> ~/.zshrc
$ echo 'alias goJava6="jenv global 1.6 && refreshZsh"' >> ~/.zshrc

After this you can run:

$ source ~/.zshrc

Installing Gradle

You can check the official documentation from Gradle on how to install it with a package manager here.
Or simply running this command:

$ brew install gradle

Test your environment

We can test this configuration by cloning this repo from SpringBoot:

$ git clone https://github.com/spring-guides/gs-rest-service.git
$ cd gs-rest-service/complete
$ gradle bootRun

By now, you should see the spring ascii art in the console, and you should have accessible: http://localhost:8080/greeting

Extra

Nowadays if you are starting a new project you might want to consider using Kotlin, to install it you can just run:

$ brew install kotlin

Success!

Now you should be able to configure multiple java versions in your local computer.

Dummy REST API with NodeJS + Express - Grekz

Johnny Boy — Sun, 16 Feb 2020 22:39:02 +0000

Overview

Hey guys! Welcome back to your channel, it’s me grekz again.
Today we will learn how to create a dummy REST endpoint with NodeJS and Express.
Nowadays whenever we talk about doing some development in Javascript we almost always have to think about bringing alone babel.
And to make our development a little more effective we are including nodemon in the mix.
Nodemon is a tool that allows us to see our changes live, something like hot-reloading for our API.

The dummy REST endpoint we are building will just help us to add two numbers that we are going to send in a GET request.
Please take in consideration that this example doesn’t use best practice on designing APIs.
Without further ado let’s start.

Let’s do this! 💪

We will start by creating a folder to contain our NodeJS + Express app and init as an npm package.

First we need to install npm and NodeJS in our computer.
I’ll set up the links in the description on how to install NPM and NodeJS.

Install npm in this link

Install NodeJS in this other link

mkdir nodejs-app
cd nodejs-app
npm init
## follow all the steps with default values.

After we have initialized our package we need to install a couple of things: nodemon, babel, express.

npm install express nodemon @babel/core @babel/node @babel/preset-env --save-dev

On a side note, I am using NVM to have multiple Node versions, but that is not necessary for this small tutorial. In case you are interested in learning or using NVM in your local environment. More on NVM

When we have everything ready we need to create a javascript file that will contain our logic. And while we are in it, we can also create the configuration file for babel:

touch app.js
touch .babelrc

In our .babelrc file we will specify what we need from babel, for this example we will use the preset-env config.
So add to .babelrc this:

{
  "presets": [
    "@babel/preset-env"
  ]
}

Now that we have configured our babel, it is time to start coding our REST endpoint.
Let us add this code to our app.js

import express from 'express'
const app = express()
const PORT = 5000
app.listen(PORT, () => {
  console.log(`Server running on http://localhost:${PORT}`)
})

This piece of code doesn't do anything relevant to our endpoint, just sets the app to listen on port 5000.

Another thing we need to add is how to run our app in package.json, to do this your package.json should look like:

{
  "name": "nodejs-app",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "nodemon --exec babel-node app.js"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "@babel/core": "^7.8.4",
    "@babel/node": "^7.8.4",
    "@babel/preset-env": "^7.8.4",
    "express": "^4.17.1",
    "nodemon": "^2.0.2"
  }
}

Now if you run our start script, we should see the message that the server is running.

$ npm start

Ok, now that we now that our server is running, it is time that we add a little logic(magic) to sum our parameters

// Add this to the bottom of app.js
app.get('/api/v1/add', (req, res) => {
    const { first = 0, second = 0 } = req.query
    const total = parseInt(first) + parseInt(second)
    res.status(200).send({
        success: 'true',
        total
    })
})

To test it you can call this url: http://localhost:5000/api/v1/add?first=4&second=5

And success!

Let me know what you think in the comments.

Prefix Sum & Suffix Sum - Programming Tools

Johnny Boy — Sun, 02 Feb 2020 22:11:12 +0000

Summary

Hey guys! It is a pleasure having you back in my articles.
Today I bring you this two tools that are widely use when trying to solve a problem in the Software Engineering industry.
We are going to start with the Prefix Sum, also called cumulative sum or inclusive scan.
And when we have covered that we will move on to the Suffix Sum, instead of having the sum direction from left to right, it will be from right to left.

Prefix Sum

To calculate the prefix sum of an array we just need to grab the previous value of the prefix sum and add the current value of the traversed array. The idea behind is that in the previous position of the prefix array we will have the sum of the previous elements. This becomes really helpful because if you want to know what is the total sum up to certain point, you can just check for the value in the prefix sum array. Another use for this programming tool is when you want to know the value between two positions in the array, without the need of going through each item in the array you can just do a calculation from the values in the prefix sum array, reducing complexity and therefor saving time and money. Without any fuss or delay let me show you how can you get the prefix sum array.

Here is the implementation in Javascript:

const prefixSum = arr => { 

    // Get the size of the array.
    const n = arr.length

    // Create an empty array of the same size as input.
    const result = new Array(n)

    // Initialize the first position of the array with the same value as the first item of the item.
    result[0] = arr[0]

    // Go through the input array, starting in the position 0, to the n.
    for (let i = 1; i < n; i++)

        // Assign the result of the previous value and the value in the current position in the input array.
        result[i] = result[i-1] + arr[i]

    return result
}

const prefixTestArray = [2, 4, 6, 8, 10, 12, 14]

console.log(prefixSum(prefixTestArray))

Suffix Sum

For the Suffix Sum array, we will use a similar approach to the Prefix Sum, with the slight modification that we wil start from the end and go to the beginning of the array.

You can check out some Javascript implementation of the Suffix Sum:

const suffixSum = arr => {
    const n = arr.length
    const result = new Array(n)
    // Instead of assigning the first position, we assign the last with the last value of the input array.
    result[n-1] = arr[n-1]

    // Go through the input array, starting in the last position, until the first.
    for( let i = n - 2; i >= 0; i-- )
        result[i] = result[i+1] + arr[i]
    return result
}

const suffixTestArray = [2, 4, 6, 8, 10, 12, 14]

console.log(suffixSum(suffixTestArray))

Conclusion

I hope you would find this useful in your near future. I know that if you have a lot of experience solving programming problems you might find this trivial, but let us not forget our humble beginnings when we didn't know too much about these simple tools that can help us in time of need.
I wish you some joyful coding days ahead of you!

AWS Certification - What I know about AWS S3 - Part 1

Johnny Boy — Sun, 26 Jan 2020 20:41:59 +0000

Summary

I began these notes the day I took my AWS Certified Solutions Architect - Associate certification exam, which I pass, thank you very much.
This topic, Storage, is really really REALLY important for the certification.
For the certification I believe that the most important topics are: S3, VPC (with all its goodies), EBS, RDS, SQS and EC2.
In this article I will try to remember all I know about S3.
It is important to you go an check out the post where I shared the lingo used in AWS, because I am not going to expand on those in here.

What is S3?

Simple Storage Service, as its name states it, helps you to store objects in the cloud. Per object the minimum size can be 0 byte, maximum size can be 5TB. Although the maximum size for a single PUT operation is 5GB.
It is recommended to use multipart upload for files bigger than 100MB.
All Storage Classes in S3 have a Durability of 11 9s.
All Storage Classes are replicated in at least 3 AZs, except S3-OneZoneAI.
All Storage Classes have first-byte latency of milliseconds, except Glacier classes.
Availability for the Standard S3 is 4 9s.

What is Glacier?

You can think of Glacier as its own service, but also as an S3 Storage Class. The ideal use for Glacier, is to store objects that are used very rarely and that can wait hours to be retrieved.
The standard retrieval time for Glacier is 3-5 hours.
Availability is 4 9s.

What is S3-IA?

S3 - Infrequent Access. You would want to use this type of storage when the object is used not so often.
The minimum storage duration charge is 30 days. This means that if you put an object and delete it after 2 days, you will still be charged for that object being stored there 30 days.
The minimum capacity charged per object is 128KB. This means that if you store a smaller object, you still get charge for an object of 128KB.
Availability is 3 9s.

What is S3-OneZoneAI?

S3 - One Zone Infrequent Access. This is almost identical to S3-IA with the main difference that there is no multi-AZ replication.
The minimum storage duration and minimum capacity charges from S3-IA are applied.
Availability is 2.5 9s.

What is S3-IntelligentTiering?

This is the Storage class that you would want to use in case that you don't know how frequently are you going to access an object. It will move the files to the most cost-effective access tier automatically.
Availability is 3 9s.

What is Glacier Deep Archive?

This is the lowest-cost storage class. Ideal for long-term retention. For data that may be accessed 1-2 times per year. A common use for this class is to store data from highly regulated industries that need to retain data for 7 or more years.
Retrieval time can be within 12-48 hours.
Availability is 4 9s.

Which are the retrieval options for Glacier?

Expedited. It retrieves your data within 1-5 minutes. For files smaller than 250MB.
Standard. Default option that will retrieve your data within 3-5 hours.
Bulk. This is the lowest-cost retrieval option. It takes within 5-12 hours.

What is SSE?

This term refers to Server Side Encryption. It is widely use when talking about data at-rest encryption.

What is SSE-C?

Server-Side Encryption with Customer-provided encryption keys. It is a way of encrypting data in S3. This type of encryption allows the user to provide the encryption key as part of the request. Amazon doesn't store the key, meaning that if you lose the key, you lose the object.

What is SS3-S3?

This options let's Amazon handles the key for you. Each object is encrypted with a unique key.

What is SSE-KMS?

Server-Side Encryption with Key Management Service (AWS KMS). S3 will use your CMKs (Customer Master Keys) from your AWS KMS to encrypt your objects. This is the most robust of all the solutions. It helps you to keep a record on who has used which keys.