Keep Calm and Learn Coding by Yuta Tsuji

Authored by Yuta Tsuji

In 2018, fortunately I had a “CHANGE ME” experience by taking a series of lessons with some colleagues to learn how to build a Web application from a professional in my company. Until that I had no experience of coding and my career had been built exclusively on non-technical job area for more than 15 years. Since the first lesson, I have been learning HTML, CSS, Javascript, jQuery, Python and Google Cloud Platform (mainly Google App Engine and Cloud Datastore) as a tool to build a mock-up of new business idea in my mind. It took me about 6 months to build my first clumsy web application since I learned what was “Terminal” like in my Mac book air.

Here is an outline of how I learned coding so far. If you are an experienced software developer, you might find some tendency of insufficient understanding of non-tech people about programming. If you are also a programming beginner, you might feel empathy with me. And if you are a non-tech person who are interested in coding just like me, I hope this entry will help you understand what you need to learn to let you stand at the start line of programming world.

Objectives of learning

From my experience, setting specific objectives is critical for learning anything new. There are unlimited number of things to learn in the world, but our time is severely limited. It should be better to discard everything other than what is essential for your objectives.

In my case, the objectives was to become able to build a minimum mock-up of new business idea in my mind. Because my current role in my company is discovering and verifying new business seeds.

No need to create modern beautiful UI. No need to be efficient and sustainable mechanism. No need to catch up latest tech trend. Security and authentication things can be postponed. Etc. It is quite simple.

If you are interested in learning coding but do not have specific objectives, this might be a good temporary objectives for you to start.


My teacher chose the followings as our tools for achieving the objectives.

Package manager: Homebrew
Code editor: Microsoft Visual Studio Code
PaaS: Google App Engine
Frontend: HTML, CSS, Bootstrap, Javascript, jQuery
Backend: Python 2.7 (+ webapp2 as web framework, Jinja2 as templating)
Database: Google Cloud Datastore
Collaboration: Gitlab

All of these are available for substantially free. Amazing!!

4 Steps to initiate coding study

Also the teacher created an excellent curriculum for us. In my understanding, the curriculum can be divided into roughly 4 steps.
(But actual curriculum was not exactly this way and was a bit more meandering. This 4 steps is my interpretation of the pure intention of the curriculum.)

1st Step: Quick access to “Hello world” on the web
2nd Step: Post something to existing web service by your code
3rd Step: Input and show data on your web application
4th Step: Collaborate with other programmers

The biggest feature of this roadmap is to create a “hello world” web application before studying any programming language. We learned basic elements and structure of simple web application at first, and afterword as parts of that we learned backend language, frontend language and how to interact with database. After taking lessons, some colleagues said it had been better to begin with studying language, but my opinion was opposite. I think that was because they had some knowledge about how a web application works before taking lessons. For me, this original order was perfect.

1st Step: Quick access to “Hello world” on the web

Here is a rough index of lesson contents in this step.

Structure of simple web application
What is Terminal
UNIX command basics
Google Cloud Platform
Install Homebrew
Install Google Cloud Platform SDK
Google App Engine(=GAE) quick start
GAE hello world tutorial

We started the first lesson by trying to become friends with “Shell” and then install some tools through it. And then we experienced well-known “Hello world” on GAE by using webapp2 framework of Python2.7 without fully understanding of the mechanism. For me, I mean a person who has been unfamiliar with CUI, the hardest part was “Shell”.
That was why I took online course of Udacity to get used to Shell.

Linux Command Line Basics | Udacity
An introduction to the Linux command line interface.www.udacity.com

By the way I became a big fan of Udacity through this coding study. On Udacity, you can take various technology related online courses in an easy way for beginners. And most of the courses are provided for free!!

For completing this step, it took me around 14 hours in total. 8 hours for taking lesson and 6 hours for self-study on Udacity. According to Udacity, average required time for completing this course is 4 hours. It took me more time just because I am not comfortable in using English. If you are comfortable in English, the total time should be shorter.

2nd Step: Post something to existing web service by your code

Here we learned Python along with the following agenda.

Install Visual Studio Code
Install Python
Python basics
Basics of HTTP / JSON / API / RESTful
Slack Incoming Webhook
Post something from your local and GAE to Slack through Incoming Webhook

The goal of this step was to create a simple backend program. As we had not yet learned frontend at this point, we used Slack Incoming Webhook as an output interface. Through this process, we could also learn how to interact with external web service via API. Using API is inevitable for our objectives.

What was disturbing me in this step was ERROR. I encountered various errors almost every time I run my code. Finding a cause of each error was almost impossible to me. Whenever an error took place, I needed to ask my teacher to solve it.

After taking lesson, I did two kinds of self-study. The one was a self-study of Python on Udacity. It provides an excellent online course for beginners.

Introduction to Python Programming | Udacity
In this course, you'll learn the fundamentals of the Python programming language, along with programming best…www.udacity.com

The second one is to create a Python program to retrieve a joke from Chuck Norris API and post it to Slack periodically.

For completing this step, it took me around 28 hours in total. 8 hours for taking lesson, 14 hours for self-study on Udacity and 6 hours for building the Slack post program.

3rd Step: Input and show data on your web application

The main topics here were Frontend and database. Agenda was the following;

Templating with Jinja2
Install Google Cloud Datastore
How to operate data in Datastore
Javascript and jQuery
Create a web application for managing ToDo list

Learning languages was fine for me. Instead it took me much time to understand how webapp2 works, which is one of the web framework of Python. And also, it was hard for me to understand how to query and process data from Google Cloud Datastore. To check and understand how those work, I thought I needed to build a small web application. So I tried to build a small app for managing prices of existing products of our company. This attempt took me several hours, but was quite effective to understand them.

I still continued to encounter dozens of errors, but gradually I got to be able to detect the cause of easy error and solve it by myself. Around this time I started to enjoy coding. As I wanted to use this new skill for my current job, I tried to create a small program for showing statistics by accessing database of the existing system maintained by professional software developers in our company. At first I assumed that was not so difficult, but it turned out to be wrong. As a result, it was terribly time consuming. Query and calculation logic was quite simple, but, to access to that database, I needed to install a new module. But unfortunately that module had not worked properly due to the DEPENDENCY ERROR… I needed lots of time to solve it. Through this experience, I learned that one of the most formidable enemies of programming beginner was execution environment, not coding it self.

I am not sure how many hours it took me to complete this step. 8 hours for taking lesson. 25 hours for self-study on Udacity listed below. And so many hours to write and debug some programs…

Intro to HTML and CSS | Udacity
In this course, you'll learn the fundamentals web development, along with best practices and professional…www.udacity.comIntro to JavaScript | Udacity
Learn the fundamentals of JavaScript, the most popular programming language in web development.www.udacity.comIntro to jQuery | Udacity
Learn how to access and modify the DOM with ease using jQuery!www.udacity.com

4th Step: Collaborate with other programmers

Here I mainly learned Git and Github on Udacity.

How to Use Git and GitHub | Udacity
Learn to use version control, an important tool for any developer. The course will focus on Git, a specific version…www.udacity.com

It took me around 14 hours to complete selfstudy on Udacity.

It would be better if I were able to use ‘git push’ for cloning my learnings from my brain into this blog automatically.

I thought I was working hard so far to complete this 4 steps, but here seems to be just the beginning of coding world. This world seems wider than ocean and higher than mountain.

Roadmap to becoming a web developer in 2019. Contribute to kamranahmedse/developer-roadmap development by creating an…github.com


My fortune was we had a perfect teacher to guide us. Otherwise, I could not have reached even this start line. Hopefully I want to contribute to my company someday in the future by providing the similar opportunity to other colleagues as I experienced in 2018.

Until that, I will keep calm and learn coding (within the range of my objectives) whatever happens in the background.

This blog is the #7 of the twenty-five blogs that we are publishing daily, one blog each day from Jan 7th until 31st — written by twenty-five of our members, sharing topics regarding “Change” — to celebrate the official change of our new company name, from HDE to HENNGE on Feb 1st.

For more information about the change in our company name:https://www.hde.co.jp/en/about-us/trade-name-changed.html

HENNGE株式会社's job postings

Weekly ranking

Show other rankings