[개발의 본질] 플로우 차트 (Flow chart란?)

728x90

처음에 웹 퍼블리싱을 시작 했을때 선생님은 항상 박스 구조를 생각하라고 하셨습니다.

웹사이트를 만들때 마크업을 무작정 작성하기 보다, A4용지나 빈종이 하나를 놓고 생각을 먼저 정리합니다.

어떻게 이 웹사이트를 마크업으로 그려 낼지에 대한 기획을 하는 것입니다.

어떤 식으로 박스 구조를 만들까? 를 생각하면서 먼저 큰 그림을 그립니다.

그러면 어떻게 내가 틀을(구조)를 생성할지에 대한 것이 정리가 되고,

그때서야 손을 키보드에 놓고 작업을 하기 시작합니다.

그렇게 하면 코드가 꼬일 일도 없고, 작업 속도가 놀랍도록 향상 됩니다.

순수 바닐라 JS 를 사용하여, 토이 프로젝트를 진행할까 합니다.

그런데 어떻게 시작을 해야할까요?? (저도 정답은 아닙니다만..)

개발 언어는 많습니다. 개발 언어는 언어일 뿐입니다.

필요 한 것은 논리적으로 생각 하고, 그것을 정리하는 일인 것 같습니다.

내가 로직을 생각 해 낼 수 있다면?? 그 어떤 언어로도 개발 할 수 있을 것입니다.

그래서 개발을 위한 브레인 트레이닝을 진행하고자 합니다.

토이 프로젝트를 하면서 논리적 사고없이 그냥 따라치며 배우는 것이 아니라,

정말 내 것으로 만들어 사고력을 길러 낼 수 있을때 까지 진행합니다.

이미 이런 사고를 도와주고, 실제로 쓰이는 tool을 가져왔습니다.

글로 먼저 써보고, 플로우 차트로 로직을 정리하면서 뇌를 최적화(?) 시켜 봅니다.

플로우차트란 어떠한 일을 처리하는 과정을 순서대로 간단한 기호와 도형으로 도식화 한것을 의미합니다.

도형으로 표시하기 위해서는 가장 기본적인 기호를 익혀야 하는데요.

대표적으로 사용하는 기호를 가져 왔습니다.

위의 기호를 가지고, 아래 표 처럼 적용을 해봅니다.

여러가지 읽어 본 것중에 간단하면서도 기호와 매치해가며 이해 하기 쉽게 되어있어 가져왔습니다.

찾아보니 다양한 JS 토이 프로젝트가 있었습니다.

저도 프로젝트를 하면서 다른사람들은 어떻게 코드를 작성했는지 분석을 해보려고 합니다.

다른 사람의 코드를 보는 것 + 그리고 어떻게 작성했는지 구조화 시켜 보는 것 또한 중요하다고 합니다.

그러면 다음 포스팅에서는 [행맨 게임 프로젝트] 를 파헤쳐 봅시다 :-)

Let's get it!

📌 플로우 차트에 대한 설명 참고 하였습니다.

코딩교육 티씨피스쿨

4차산업혁명, 코딩교육, 소프트웨어교육, 코딩기초, SW코딩, 기초코딩부터 자바 파이썬 등

tcpschool.com

728x90