Sign in

Okay. I finally fixed the problem. I took so long time to fix this. So I’ll leave a memo for somebody struggles with the same situation with me!

Use gulp.series/ gulp.parallel instead of gulp.task

Pass function name to gulp.series/ gulp.parallel, not STRING.

If your function returns nothing, then pass cb(callback) as a parameter and call it at the end of your function to let gulp know the function’s task is over.

・・・const myFunc = (cb) => {
console.log("I return nothing");
cb();
}
module.exports.build = gulp.series(
foo, // should not be strings!
gulp.parallel(js, sass, myFunc), // should not be strings!
bar. // should not be strings!
);

Hope it’ll be helpful to someone.

Cheers!


I currently learning about Object-Oriented Programming and have been struggling with grasping the difference between Inheritance and Delegation.

Today, I had an a-ha moment, so let me scribble down it.

Inheritance

Here is the example of Inheritance.

(Just script files, so nothing shows up in the browsers)

The class PrintBanner extends Banner. So PrintBanner has the identical methods of the Banner has.

Delegation

Then we have the example of delegation.

The PrintBanner calls Banner as an instance and assigns it to the banner variable. PrintBanner can call banner’s methods as well, like this.banner.{method’s name}, but it doesn’t know what kind of…


In the transportation layer, there are two main protocols in TCP/IP. TCP and UDP. Both are important. No superiority. They are used for different purposes.

What is TCP?

It stands for Transmission Control Protocol. It is a connection-oriented protocol. Before sending data, it establishes a connection first, to make sure that it will be able to send data to another side. It is called the three-way handshake! It’s like careful and detail-oriented people in your office or class.

What happens in the transport layer…

Alice“Hey Bob! I’d like to send data to you. Is that okay with you?”

Bob “ Sure! No problem…


Sass stands for Syntactically awesome style sheets(Ooh, I LOVE this name).
It is one of the CSS pre-processors. You write your code in Sass language. Then it’ll be compiled to CSS.

Whereas, PostCSS is a post-processor. Literally. So you can write whatever you want as long as it is CSS. Then it’ll also be compiled to CSS. But the upgraded version from what you wrote.

Let me give you an example.

Sass:

What you have: flour, butter, eggs, and water

Using Sass means you got to grab every ingredient and mix it, here.

What Compiler does: baking bread

What you get…


Currently, I’ve been learning about TCP/IP. I’ve just started a book about it last week.

The book starts with the OSI model 🤔 My boss also says the OSI model is important. I had wondered why. Because I learn the TCP/IP.

Today, I got it.

So, the OSI model is a theory. It’s never been used. Because that is a concept. It is used for understanding computing systems. On the other hand, the TCP/IP is an actual model that is used for transmitting data over the Internet.

Hmm! So that I need to understand the OSI model first. Makes sense finally.


This was kind of what I wanted to do. But it did not work.

@import styles from “./yourcssfile.css”

...

<div className={styles.title styles.text}>
some codes ...
</div>

Here is the answer!

@import styles from “./yourcssfile.css”

...

<div className={`${styles.title} ${styles.text}`}>
some codes ...
</div>

Template literals!!


What I learned

Inspect >> Network

You can set the speed of loading!

When to use?

For Key Visuals or Hero images.
Those are the entrance images of the page.
So I want to check the page in slow situations.


Through some projects collaborating with other engineers, I have learned that there are a couple of things that we should check before creating a pull request.

Delete Comments

During development, comments are useful. Ideally, it’s better to delete all comments. If we declare meaningful enough variable names, comments are unnecessary in many cases.

Delete unused dependencies

We need to conjure! So we try a lot of things and get errors and try something again. That’s pretty common. But don’t forget to remove unused dependencies.

you can remove it by yarn remove <packagename> .
It’ll update your package.json and yarn.lock .

Delete unnecessary console.log( )s

Sometimes we need to…


Hello, world! I’m Nao from Japan :)

Recently, I am doing codewar’s kata daily. One of the common important tips to learn is realizing own progress. So, I will share my little “Wow!” about JavaScript in this series.

Here we go!

String.prototype.match()

Did you know this method?
Let me show you how “Wow” it is.

In this kata, you are required to, given a string, replace every letter with its position in the alphabet.

If anything in the text isn’t a letter, ignore it and don’t return it.

"a" = 1, "b" = 2, etc.

Example

alphabetPosition("The sunset sets at twelve…

Hey everyone! I’ll try to explain about Closure today.

It has so many explanations! In my case, I had read many articles, but I didn’t grasp the gist of it. I wasn’t able to imagine what’s going on at the first moment.

So, before jumping in the definition of words, I’d like to start with an example. I’ll try not to use the words, Closures, and Leical Environment until the end.

All right. Here we go!

The fat lady is here!!

We have an empty function named fatLady! She guards the entrance to Gryffindor Common Room at Hogwarts.

function fatLady(){};
https://harrypotter.fandom.com/wiki/Fat_Lady?file=FatLady.png

The code should be like…

Nao

Software engineer in Tokyo

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store