현실적인 개발자 로드맵 - 무엇부터 배워야 할까요?
# 포스팅에서 사용된 코드의 전체 코드는 https://github.com/ITVillage-Kevin/roadmap-jsp 에서 다운로드 받으실 수 있습니다.
# 해당 포스팅은 IT Village 유튜브 채널(https://www.youtube.com/channel/UCSIvsntWA8aJ3Apoc7kTxig)에서도 시청하실 수 있습니다.
안녕하세요, Kevin입니다. 지난 시리즈에 이어 오늘은 개발자가 되려면 무얼 배워야 하는지에 대한 이야기부터 하겠습니다. 당연한 이야기이겠지만 개발자가 되기위해서 배워야 할 기술들은 상당히 다양하고 많습니다. 그리고 여기서 말하는 개발자는 주로 웹 개발자입니다. 아래 로드맵을 먼저 살펴보시면 "우와, 이걸 언제 다 배워??" 라고 한숨부터 나올지도 모르겠네요. ^^ 그래도 일단 스크롤을 내려서 끝까지 주욱 살펴보시길 권해드립니다.ㅎ
2018 웹 개발자 로드맵
[출처: https://github.com/devJang/developer-roadmap]
현실적인 개발자 로드맵
클라이언트 + 서버(JSP Model 1)
[JSP 모델1 구성도]
[TO DO 웹 애플리케이션]
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<html>
<head>
<meta http-equiv="Content-Language" content="ko"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>TODO 등록</title>
<style>
#todoList {
border: 1px solid #8F8F8F;
width: 500px;
border-collapse: collapse;
}
th, td {
padding: 5px;
border: 1px solid #8F8F8F;
}
</style>
<script>
function registerTodo(){
var todoName = document.getElementById("todoName").value;
var todoDate = document.getElementById("todoDate").value;
if(!todoName){
alert("할일을 입력해주세요..");
return false;
}
if(!todoDate){
alert("날짜를 입력해주세요.");
return false;
}
var form = document.getElementById("todoForm");
form.submit();
}
</script>
</head>
<body>
<h3>TO DO 등록</h3>
<div>
<form id="todoForm" method="POST" action="/result_model1.jsp">
<input type="text" name="todoName" id="todoName" value=""/>
<input type="date" name="todoDate" id="todoDate" value=""/>
<input type="button" id="btnReg" value="등록" onclick="registerTodo()"/>
</form>
</div>
<div>
<h4>TO DO List</h4>
<table id="todoList">
<thead>
<tr>
<td align="center">todo name</td>
<td align="center">todo date</td>
</tr>
</thead>
<tbody>
<c:choose>
<c:when test="${fn:length(todoList) == 0}">
<tr>
<td align="center" colspan="2">할 일이 없습니다.</td>
</tr>
</c:when>
<c:otherwise>
<c:forEach items="${todoList}" var="todo">
<tr>
<td>${todo.todoName}</td>
<td align="center">${todo.todoDate}</td>
</tr>
</c:forEach>
</c:otherwise>
</c:choose>
</tbody>
</table>
</div>
</body>
</html>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ page import="com.itvillage.vo.ToDo" %>
<%
request.setCharacterEncoding("UTF-8");
response.setContentType("text/html;charset=UTF-8");
System.out.println("Hello Servlet doPost!");
String todoName = request.getParameter("todoName");
String todoDate = request.getParameter("todoDate");
ToDo.todoList.add(new ToDo(todoName, todoDate));
RequestDispatcher dispatcher = request.getRequestDispatcher("/todo_model1.jsp");
request.setAttribute("todoList", ToDo.todoList);
dispatcher.forward(request, response);
%>
<html>
<head>
<meta http-equiv="Content-Language" content="ko"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>TODO 등록</title>
<script>
</script>
</head>
<body>
</body>
</html>
package com.itvillage.vo;
import java.util.ArrayList;
import java.util.List;
public class ToDo {
private String todoName;
private String todoDate;
public static List todoList = new ArrayList<>();
public ToDo(String todoName, String todoDate) {
this.todoName = todoName;
this.todoDate = todoDate;
}
public String getTodoName() {
return todoName;
}
public String getTodoDate() {
return todoDate;
}
}
[JSP 모델1 방식에서 추출한 기술]
짜잔~ 여러가지 기술들이 추출 되었습니다. ^^ 웹 브라우저에서 사용자들에게 보여지는 부분은 HTML로 구성이 됩니다. 그리고 HTML로 구성된 화면을 조금 더 예쁘게 보여주기 위해서 CSS가 사용되며, 폼을 전송하는 부분에서는 Javascript가 사용이 됩니다.
사실 Javascript를 TODO 애플리케이션에서 사용하지 않고, 데이터를 전송할 수 있으나 실무에서는 폼 데이터를 전송하기 전에 클라이언트측에서 데이터를 전송하기 전에 해당 데이터가 올바른 데이터인지 검사를 하는데 그 검사를 Javascript가 맡아서 하게 되는겁니다. 물론 Javascript로 검사한다고 해서 그 검사를 우회해서 데이터를 변조하는 방법이 있기때문에 서버측에서 반드시 유효성 검사를 다시 해야되나 이런 부분은 주제를 벗어나기때문에 우선은 생략하도록 하겠습니다.
HTML과 Javascript, CSS는 개발자가 되기 위한 필수 기술이기때문에 꼭 학습을 해야되는 부분입니다. 다만 Javascript를 공부하다보면 굉장히 방대하고 공부하면 할수록 점점 어려워진다는 사실을 알 수 있을텐데 Javascript를 많이 알고 능숙하게 사용하실 수 있다면 그만큼 자신의 경쟁력을 향상시키는것이라고 보시면 될것 같네요. ^^
그럼 JSP는 배워야 할까요 배우지 말아야 할까요? 이건 어떤 기업에 입사를 하느냐에 많이 좌우되는데 Ajax 기술이 발달함으로 인해서 JSP의 사용 빈도는 점점 줄어들고 있는 추세입니다. 기술 트렌드를 잘 따라가는 기업일수록 JSP 사용 빈도가 작지 않을까 생각합니다.
Java는 Java 개발자가 되기위해서는 반드시 알아야 될 기술이기에 따로 설명을 드리지 않아도 되겠죠? ^^
데이터베이스의 경우 클라이언트 측으로부터 전달 받은 데이터를 저장하는 가장 범용적인 방법이기때문에 반드시 배우셔야 하는데 MySQL(또는 MariaDB) 등의 오픈 소스 DB에 대한 사용법과 SQL 쿼리 작성에 대한 학습을 꾸준히 하시는게 좋을것 같습니다. 데이터베이스 종류가 다양하지만 한국에서 가장 많이 사용되는 데이터베이스는 MySQL(또는 MariaDB)과 Oracle + MSSQL 이지 않을까 하는데요. 기업에서는 PHP + MySQL(또는 MariaDB), JSP + Oracle, ASP + MSSQL 의 조합으로 많이들 사용해왔습니다.
마지막으로 말씀드릴게 IDE(Integrated Development Enviroment)인데요.
코딩, 디버깅, 테스트, 컴파일, 배포를 하나의 환경에서 할 수 있도록 제작된 한마디로 말해서 맥가이버 같은 개발 도구라고 보시면 됩니다. 자바 개발에 있어서 오픈 소스 IDE인 이클립스가 전통적으로 가장 많이 사용되고 있을것으로 생각됩니다. 저는 개인적으로 몇년전부터 IntelliJ를 사용하고 있는데 현재까지는 최고의 IDE라는 생각이 듭니다. 기업에서 사용하려면 유료라는게 단점이긴 하지만 개인이 사용 가능한 커뮤니티 버전이나 학생용 라이센스를 잘 활용할 수 있으니 참고하시길 바랍니다. IDE 이외에 서브라임텍스트, Atom 등의 Editor가 있으니 참고하시길요.
[참고 사이트]
https://github.com/kamranahmedse/developer-roadmap
https://github.com/devJang/developer-roadmap
https://ko.wikipedia.org/wiki/PHP
https://ko.wikipedia.org/wiki/%EC%9E%90%EB%B0%94%EB%B9%88%EC%A6%88
https://www.w3schools.com/html/default.asp
https://www.w3schools.com/css/default.asp
https://www.w3schools.com/js/default.asp
https://ko.wikipedia.org/wiki/Ajax
'현실적인 개발자 로드맵' 카테고리의 다른 글
| 현실적인 개발자 로드맵(6) - Spring의 탄생 (1) | 2018.10.03 |
|---|---|
| 현실적인 개발자 로드맵(5) - jQuery의 등장 (1) | 2018.09.21 |
| 현실적인 개발자 로드맵(4) - Ajax의 등장 (3) | 2018.09.14 |
| 현실적인 개발자 로드맵(3) - JSP 모델2 (1) | 2018.09.07 |
| 현실적인 개발자 로드맵(1) - Intro (0) | 2018.08.31 |