A story about making a cli twitter client with typescript@WeJS Festival

💪 ME 💪


profile

Ota Naoto

A frontend engineer

Kakaku.com, Inc

Tabelog

Outline

  1. An introduction of twsh
  2. What I experienced in personal programming
  3. Good point of typescript

An Introduction of twsh

Do you know "twsh"?

https://www.npmjs.com/package/twsh

twsh logo

What is "twsh"?

  • You can enjoy twitter on your terminal.(only post tweet)

The reason I made "twsh"

Don't you want to post tweet, when you execute command or writing code on ther terminal?

Yes, I want to post tweet.

Ok, Let's use "twsh".

What I experienced in personal programming

  1. My application improves the quality of life
  2. I can realize my idea by my own programming
  3. I can obtain some technical skills

My application improves the quality of life

Before creating "twsh", I was in trouble because I couldn't post tweet on the terminal.

But now, I can post tweet on the terminal, which is great.

I can realize my idea by my own programming

Until then

Be in trouble -> Ok, Let's search for appliction that can solve problem

Now

Be in trouble -> Ok, Let's create ideal application

I can obtain some technical skills

  • npm publishing
  • CI tools' settings
  • github and git skills
  • programming skills

Good point of TypeScript

  1. Coding with confidence
  2. Easy to mentainance
  3. If you can write JavaScript, you can write TypeScript
  4. Excellent code completion

Coding with confidence

By protected by type,

you can write source code with confidence,

because you know the type of variable foo,

the return value of function bar and

the arguments the function baz needs.

When JavaScript

import { someFunction } from './util'

const Foo = { id: 1, name: 'foo' }
const Bar = { id: 2, name: 'bar' }
const Baz = { id: 3, name: 'baz' }

const originalPeople = [Foo, Bar, Baz];
const returnValue = someFunction(originalPeople);

console.log(returnValue) // do you imagnie?

When TypeScript

import { Person, someFunction } from './util'

const Foo: Person = { id: 1, name: 'foo' }
const Bar: Person = { id: 2, name: 'bar' }
const Baz: Person = { id: 3, name: 'baz' }

const originalPeople = [Foo, Bar, Baz];
// typescript let you know what type someFunction returns
const returnValue = someFunction(originalPeople);

console.log(returnValue) // you can imagine

Playground Link

Easy to mentainance

By protected by type,

you can easily modify source code for new feature or refactor,

because typescript tell you the right type.

Playground Link

If you can write JavaScript, you can write TypeScript

TypeScript is a typed superset of JavaScript that compiles to plain JavaScript.

https://www.typescriptlang.org/

Syntatically, any regular JavaScript is valid TypeScript

Excellent code completion

As you see, typescript language server drive your programming expericnce greater by code hints and completion

Let's Start TypeScript !!

At Last

We are hiring!

WEB、アプリ、フロントエンドエンジニアなど様々な職種でエンジニア募集中です!

カジュアル面談(オフィス訪問)歓迎です!

WANTEDLYはこちら!

Copyright © Kakaku.com Inc. All Rights Reserved.

Thanks for all