We have started a coder study group.
Looking back on the internal study session on module coding

Hello, this is Maruyama from the Coding Factory Department.
Two months ago, we held a study session on "module coding" for our in-house coders.
Planning and preparing for the study session while going about my regular work was quite a challenge, but once I actually carried it out, I felt that my experience as a Monosasu Juku instructor came in handy, and I also gained a lot of new information, so in this article I'd like to talk about what motivated me to hold the study session and what I felt after hosting it.

What prompted me to start a study group?

This is the cover of the study group slides. I focused on making it easy to read.

Coding Factory does have a forum for sharing information, and holds a monthly information sharing meeting called the Coder Meeting.
Apart from that, there were two other reasons that made me decide to hold a study group.

The first reason is that the number of new coders who joined after attending Kamiyama Monosasu Juku and other schools has increased, and Coding Factory has become a large group. Therefore, I thought it would be good to have a place where we could share information a little more thoroughly.
In addition, by following the "coding guidelines" that we at Coding Factory follow, we can make up for individual coding differences to a certain extent, but when I look at the source code of new coders,
"I think this part can be separated a bit more."
Sometimes I feel like it's a bit of a stretch to think of this part as a module.
Therefore, I would like to give you some advice on the key points to keep in mind in this regard.

The second reason is that last year I had the experience of teaching in the first term of Kamiyama Monosasu Juku, but since returning to regular work, I haven't had many opportunities to put that experience to use.
Therefore, I decided to hold a study session as an opportunity to put my experience as a lecturer to good use.

The journey to holding the study session

First, we started by preparing slides to present in front of the class.
I had many opportunities to see slides presented by engineers at study sessions held outside the company, as well as slide materials on SlideShare , so I was able to get started right away.
As we started to work on it, I kept thinking things like, "This part is too long, so I'll reduce it in the slides and cover it in the explanation," or "This part seems like it would be difficult to answer questions about in its current form, so I'll do some research beforehand."

Try holding the event

Balancing work and preparing materials was harder than I expected.

Creating slide presentations in my free time or after returning home while working on my daily projects was quite a challenge, and things didn't go as well as I had hoped.
In addition, we tried to cram too much information into this study session, so it ended up being nearly 100 slides long, and the total presentation time was nearly an hour and a half, so I thought it would be important to summarize it more concisely.

Maybe it would be better to separate the organizers of the study group from the presenters?

This time, I was both the organizer of the study group and a presenter, so I had to adjust schedules and prepare materials while keeping an eye on the status of my own and my teammates' projects, which was quite tiring.
When one person is both the organizer and presenter, the event inevitably depends on the motivation and busyness of the person involved, which means that events tend to become irregular or even disappear altogether.

Also, in my own opinion, if we rely on the efforts of one person, we will end up depending on that person, and the information and burden will be unevenly distributed. Instead, I think it would be better if it became a place where everyone can send out information. For that reason, I feel that measures to lower the hurdles to holding an event are necessary.

What I was able to utilize thanks to my time as a lecturer at Kamiyama Monosasu Juku

I was able to put my experience as a lecturer at Kamiyama Monosasu Juku to good use.
The idea of having "time for the audience to participate (to engage the audience)" is something I have learned through practicing it while working as a Monosasu Juku instructor, and at this study session too I set aside two or three minutes for discussion in the form of a quiz, posing questions such as "Where do the modules on this site end up?"
Perhaps thanks to this, even though it was a long session of over an hour, I think we were able to complete it without any boredom.

For example, when watching lectures or presentations from overseas universities on YouTube, it is common to see "audience participation time," where the presenter asks the audience questions, makes them laugh with humorous phrases, etc. Doing so creates two-way participation, which keeps both the presenter and the audience motivated, so I personally think it's a good thing.

Even though we had rehearsed, there were times during the study session when the content we were trying to convey was momentarily forgotten.
Even in those situations, the ability to speak without getting stuck and thinking while speaking has remained with me even now, some time after my teaching career ended, so I would like to continue to cherish these two things in the future.

An actual website was shown (left), and after the participants discussed it, a correct answer was presented (right).

This time I talked about what I thought after hosting a study session.
Because this was our first time, there were things that went well, but there are still many challenges ahead, including problems.

We will continue to hold study sessions in the future, and if they go well, we would like to introduce them to you again.

bonus

About Module Coding What is a module?

A module is a group of parts that can be separated into headings, text, or other parts that fulfill certain functions on a page.
For example, if we take the Monosasu website as an example, we can divide it into a header, hero image, explanatory text, heading, and service description module, as shown in the image below.

Examples of dividing modules: headers, hero images, headings, etc., divided by role.

Then, for each role, HTML and CSS will be written on a modular basis.
CSS design theory has become popular among web developers recently.
The focus is often on how to mark up things, such as how to name classes, but I think it's also important to recognize the parts of a website by dividing them into units, such as by module or by role, so it's good to remember that.

Also, I have talked about how to think about modules and how to mark up HTML and CSS classes, etc., in my previous article on Coder's Koda Koda, " Towards a New Era of CSS - Formulation of Coding Guidelines #03 ", so I think it would be easier to understand if you take a look at that as well.
The idea of "module coding" itself is not a particularly new technique, as it is a method of dividing and managing elements into groups of parts called modules or components, such as SMACSS, BEM, and FLOCSS, which are becoming standard in current website design.

However, the pace of web production technology these days is so fast that if you don't stay up-to-date and keep up with the latest information, you'll quickly be left behind.
It is very important to think alone, ask yourself questions and build a theory, but it is also important to share your ideas in places like study groups, or conversely, listen to the opinions of others and absorb their ideas.