개발경력 8년차에 접어들고 있습니다. 시간이 정말 빠르네요.

이제 분석설계 위주로 하다보니 1년 중 개발하는 시간이 정말 짧아지고 있습니다.

그동안의 경험을 바탕으로 초급 개발자가 효율적으로 공부하는 방법을 공유하려고 합니다.

각 개발 언어에 대한 공부는 기본!

Html5, Javascript(jQuery), Java, 스프링 프레임워크, SQL 등에 대한 기본적인 문법 공부는 기본이겠죠.

(공공기관 SI 프로젝트에서 주로 사용하는 프로그래밍 언어 기준)

그런데 단순히 구글링이나 책등을 통해서 개발언어에 대해 공부 하는것만으로는 실제 프로젝트 투입해서 개발할 때는 부족합니다. 정해진 기간 내에 반드시 개발을 완료해야하기 때문이죠.

그래서 평소에 공부하는 방법을 좀 달리할 필요가 있습니다. 단순히 문법을 익히고, helloworld를 찍어내는 것과 같이 단순한 기능을 개발하면서 공부하는건 도움이 안됩니다.

그럼 어떤식으로 공부하는게 좋은지 알아보겠습니다.

첫번째. 어느정도 완성도가 있는 작은 단위의 기능을 만들어본다.

게시판 성격의 단순히 데이터만 핸들링 하는 기능은 의미가 없습니다.

예를 들어 아래와 같이 <textarea>에 있는 각 단어를 조합해서 표시해주는 기능을 만든다고 하겠습니다.

textarea에 키워드를 입력하고 키워드 조합 버튼 클릭

textarea에 있는 키워드들을 조합해서 표시

화면을 보시면 대충 어떤 기능인지 감이 오실겁니다. 기능은 단순합니다.

여기에서 중요한 것은 단순히 결과만 나오면 된다라는 생각으로 개발하는게 아니라!!

뷰(HTML)와 기능(Javascript)을 분리해서 개발하는거죠.

즉, 위의 예에서 <textarea>를 몇개 추가하더라도 Javascript를 수정하지 않아도 기능이 잘 작동해야 합니다.

개발할 때 이런식의 사고는 상당히 중요하고, 자신의 개발실력을 한층 더 업그레이드 해줍니다.

두번째. 다른 사람들에게 배포할 공통함수를 만들어 보는 겁니다.

예를 들면 form 태그의 값들을 validation(필수, 숫자 등)하는 공통함수를 만들어 봅니다. 물론 이미 외국의 똑똑한 분들이 만든 자바스크립트 라이브러리가 있습니다. 하지만 HTML과 Javascript를 어떤식으로 개발해야하는지 도움이 되는 예제라고 생각합니다.

같은 프로젝트를 하는 사람들에게 내가 만든 공통함수를 사용하라고 전파한다 생각하면서 간단한 1페이지짜리 문서(기능 정의서)를 만듭니다.

예를 들어 다른 사람들은 아래와 같이 사용하게 되겠죠.

(물론 또다른 규약(HTML)이 필요합니다. 이미 validation 라이브러리를 사용해본 개발자는 아실겁니다. ^^)

if(!util_frmValidate('formId')){
  return;
}

제가 말하고자 하는건 여러 사람이, 여러 상황에서 사용할 수 있는 공통함수를 만들어 보는게 공부에 도움이 된다는 겁니다.

세번째. 데이터 흐름. 저장 시점, 사용자의 다양한 행동을 고려하면서 개발한다.

개발공부를 하면서 작은 기능을 만들어 볼 때 데이터는 어떤식으로 핸들링 할지, 그리고 사용자의 다양한 행동을 커버(에러 없이)할 수 있도록 개발을 해야 합니다.

단계별로 데이터를 사용자가 입력(선택)하는 기능을 예로 들어보겠습니다. (흔히 자동차 보험료 계산 등을 할 때 많이 보는 기능이죠)

첫번째 선택 화면

다음을 누른 경우 보여지는 두번째 화면.

다음을 누른경우 마지막 화면

위 기능을 어떻게 만들어야 할까요?

사용자가 다음 버튼을 클릭할 때마다 request를 날려서 데이터를 저장하고 다음 단계 페이지를 로딩하는 방식으로 개발해야 할까요?

다음단계를 클릭해서 이동한 화면(최초 등록)과 이전 단계를 클릭해서 이동한 화면(수정)이 동일한데, 등록과 수정을 어떻게 구분해서 데이터를 처리해야할까요?

사용자가 최종 완료단계까지 가기 전에 브라우저를 종료하면 중간에 저장된 데이터는 어떻게 처리해야 할까요?

등등 데이터를 어떤식으로 처리해야할지를 고민해보는 겁니다. 데이터 처리방식에 따른 장단점, 예외상황 등을 고민해보는거죠.

참고로 위의 기능은 사용자가 다음 버튼이나 이전 버튼 클릭시 페이지(request 요청) 이동 없이 Javascript 만으로 작동합니다. 즉, 화면을 구성하는 파일이 3개가 아니라 1개의 파일이라는 거죠. 데이터는 가장 마지막에 '완료'를 클릭했을 때 한번에 저장하는 방식입니다.

사용자가 이전, 다음 버튼 클릭시 그에 맞게 버튼 글자와 버튼 클릭시 처리되는 이벤트가 달라지는데 한번 만들어 보는 것도 도움이 되리라 생각합니다. (<button>태그가 여러개 있는 형태가 아닙니다.)

이상으로 초급 개발자가 기본적인 문법을 공부한 이후에 개발 스킬을 업그레이드 하기 위해 공부하는 방법을 알아봤습니다. 실제 프로젝트에서는 개발일정이 상당히 중요합니다. 야근하기 싫다면 평소에 다양한 기능을 만들어보면서 개발스킬을 익히는게 좋습니다.

SI 프로젝트 초급 개발자가 효율적으로 공부하는 방법(기본적인 문법 익인 이후)