JSP로 강의평가 웹 사이트 개발하기 ④ 데이터베이스 구축하기
JSP로 강의평가(Lecture Evaluation) 웹 사이트 만들기 네 번째 시간입니다. 이번 시간에는 데이터베이스를 구축하는 시간을 가져보도록 할게요. 지난 시간에는 웹 사이트의 디자인을 전반적으로 처리를 하는 시간을 가졌으므로, 데이터베이스를 구축하는 것은 그다지 어렵지 않을 것 같습니다. 사실 웹 디자인을 작업하면서 설계적인 측면을 고려를 하셨을 것이기 때문이에요. 데이터베이스에서는 테이블(Table)이라는 것을 단위로 설정합니다. 하나의 데이터 모델을 테이블로 설정하는 거죠. 대표적으로 테이블의 예시로는 회원 정보, 강의 정보, 평가 정보 이런 식으로 들어갈 수 있습니다. 저희가 개발한 웹 디자인에서는 오직 세 개의 테이블만 만들어주면 됩니다. 바로 평가 테이블, 회원 테이블, 추천 테이블이랍니다. 일단 테이블을 만들기 이전에 데이터베이스를 생성하는 것부터 해보도록 합시다.
MySQL에 접속한 이후에 다음의 두 명령어를 입력합니다.
CREATE DATABASE LectureEvaluation; #데이터베이스 생성
USE LectureEvaluation; #생성한 데이터베이스에 접속
▶ 평가 테이블(Evaluation Table)
CREATE TABLE EVALUATION (
evaluationID int PRIMARY KEY AUTO_INCREMENT, #평가 번호
userID varchar(50), #작성자 아이디
lectureName varchar(50), #강의명
professorName varchar(50), #교수명
lectureYear int, #수강 연도
semesterDivide varchar(20), #수강 학기
lectureDivide varchar(10), #강의 구분
evaluationTitle varchar(50), #평가 제목
evaluationContent varchar(2048), #평가 내용
totalScore varchar(10), #종합 점수
creditScore varchar(10), #성적 점수
comfortableScore varchar(10), #널널 점수
lectureScore varchar(10), #강의 점수
likeCount int #추천갯수
);
위와 같이 데이터베이스 테이블을 설계할 수 있습니다. 기본적으로 어떠한 평가는 한 명의 사용자가 작성을 한다는 점에서 '작성자 아이디' 속성이 들어가는 것을 확인할 수 있습니다. 나머지는 단순하게 정수형은 int, 문자열형은 varchar를 사용해 자료형을 정했습니다. 기본적으로 위와 같이 웹 디자인을 보면서 작업하시는 것이 좋습니다.
▶ 회원 테이블(User Table)
CREATE TABLE USER (
userID varchar(50), #작성자 아이디
userPassword varchar(50), #작성자 비밀번호
userEmail varchar(50), #작성자 이메일
userEmailHash varchar(64), #이메일 확인 해시값userEmailChecked boolean #이메일 확인 여부
);
위와 같이 데이터베이스 테이블을 작성할 수 있습니다. 특이한 부분이라면, 강의 평가를 무차별하게 남발할 수 없도록 하는 시빌 공격(Sybil Attack)의 기본적인 방어법이라고 할 수 있습니다. 이메일을 인증해야만 강의 평가를 달 수 있도록 하는 것입니다. 이 때는 해시 데이터가 사용되는 것이 합당할 것입니다. 이렇게 데이터베이스 구축이 완료되었습니다. 정말 쉽습니다.
▶ 추천 테이블(Like Table)
CREATE TABLE LIKEY (
userID varchar(50), #작성자 아이디
evaluationID int, #평가 번호
userIP varchar(50) #작성자 아이피
);
추천 테이블은 이름을 LIKEY로 설정했습니다. 사실상 관계 테이블(Relation Table)이라고 할 수 있답니다. LIKE는 MySQL 안에서 예약어로 사용이 되고 있기 때문에 LIKEY로 설정을 한 거에요.
'JAVA & JSP' 카테고리의 다른 글
| JSP로 강의평가 웹 사이트 개발하기 ⑥ 회원가입 및 이메일 전송하기 (22) | 2018.01.26 |
|---|---|
| JSP로 강의평가 웹 사이트 개발하기 ⑤ 회원 데이터 모델링 (0) | 2018.01.26 |
| JSP로 강의평가 웹 사이트 개발하기 ③ 웹 디자인 개발하기 (1) | 2018.01.26 |
| JSP로 강의평가 웹 사이트 개발하기 ② 웹 디자인 기초 잡기 (5) | 2018.01.26 |
| JSP로 강의평가 웹 사이트 개발하기 ① 준비물 알아보기 (4) | 2018.01.21 |
JSP로 강의평가 웹 사이트 개발하기 ③ 웹 디자인 개발하기
JSP로 강의평가(Lecture Evaluation) 웹 사이트 개발하기 강좌의 세 번째 시간입니다. 지난 시간에는 웹 디자인의 기초적인 틀을 잡았으므로 이번 시간에는 프로젝트에 필요한 전체 웹 디자인을 모두 처리하는 시간을 가지도록 하겠습니다. 이러한 작은 프로젝트에는 기획자, 디자이너, 서버 개발자를 따로 나눌 필요 없이 우리가 혼자서 모든 것을 개발하는 것이므로 디자인을 하면서 머릿 속으로 설계를 해나가시는 것이 제일 빠르게 개발을 하는 방법이라고 할 수 있습니다. 당장 부트스트랩 프레임워크로 이것저것 컴포넌트를 웹 사이트 내에 추가를 하시면서 "이런 기능도 있으면 좋겠지? 이런 것 쯤이야 서버 프로그램 짜는 것은 쉬울 거니까."라고 생각하세요.
위와 같이 프로젝트를 구성합니다. 이전 시간에서 그냥 index.jsp, userLogin.jsp, userRegister.jsp 세 가지 페이지를 이용해서 웹 디자인을 마친거라고 할 수 있습니다. 먼저 index.jsp 페이지부터 작성해보도록 하겠습니다.
▶ index.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!doctype html>
<html>
<head>
<title>강의평가 웹 사이트</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- 부트스트랩 CSS 추가하기 -->
<link rel="stylesheet" href="./css/bootstrap.min.css">
<!-- 커스텀 CSS 추가하기 -->
<link rel="stylesheet" href="./css/custom.css">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="index.jsp">강의평가 웹 사이트</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbar">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="index.jsp">메인</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" id="dropdown" data-toggle="dropdown">
회원 관리
</a>
<div class="dropdown-menu" aria-labelledby="dropdown">
<a class="dropdown-item" href="userLogin.jsp">로그인</a>
<a class="dropdown-item" href="userRegister.jsp">회원가입</a>
<a class="dropdown-item" href="userLogout.jsp">로그아웃</a>
</div>
</li>
</ul>
<form action="./index.jsp" method="get" class="form-inline my-2 my-lg-0">
<input type="text" name="search" class="form-control mr-sm-2" placeholder="내용을 입력하세요.">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">검색</button>
</form>
</div>
</nav>
<div class="container">
<form method="get" action="./index.jsp" class="form-inline mt-3">
<select name="lectureDivide" class="form-control mx-1 mt-2">
<option value="전체">전체</option>
<option value="전공">전공</option>
<option value="교양">교양</option>
<option value="기타">기타</option>
</select>
<input type="text" name="search" class="form-control mx-1 mt-2" placeholder="내용을 입력하세요.">
<button type="submit" class="btn btn-primary mx-1 mt-2">검색</button>
<a class="btn btn-primary mx-1 mt-2" data-toggle="modal" href="#registerModal">등록하기</a>
<a class="btn btn-danger ml-1 mt-2" data-toggle="modal" href="#reportModal">신고</a>
</form>
<div class="card bg-light mt-3">
<div class="card-header bg-light">
<div class="row">
<div class="col-8 text-left">컴퓨터개론 <small>나동빈</small></div>
<div class="col-4 text-right">
종합 <span style="color: red;">A</span>
</div>
</div>
</div>
<div class="card-body">
<h5 class="card-title">
정말 좋은 강의에요. <small>(2017년 가을학기)</small>
</h5>
<p class="card-text">강의가 많이 널널해서, 솔직히 많이 배운 건 없는 것 같지만 학점도 잘 나오고 너무 좋은 것 같습니다.</p>
<div class="row">
<div class="col-9 text-left">
성적 <span style="color: red;">A</span>
널널 <span style="color: red;">A</span>
강의 <span style="color: red;">B</span>
<span style="color: green;">(추천: 15★)</span>
</div>
<div class="col-3 text-right">
<a onclick="return confirm('추천하시겠습니까?')" href="./likeAction.jsp?evaluationID=">추천</a>
<a onclick="return confirm('삭제하시겠습니까?')" href="./deleteAction.jsp?evaluationID=">삭제</a>
</div>
</div>
</div>
</div>
<div class="card bg-light mt-3">
<div class="card-header bg-light">
<div class="row">
<div class="col-8 text-left">컴퓨터그래픽스 <small>홍길동</small></div>
<div class="col-4 text-right">
종합 <span style="color: red;">B</span>
</div>
</div>
</div>
<div class="card-body">
<h5 class="card-title">
나쁘지 않은 것 같습니다. <small>(2017년 여름학기)</small>
</h5>
<p class="card-text">컴퓨터그래픽스를 처음 배웠는데, 상당히 재미있었던 것 같아요.</p>
<div class="row">
<div class="col-9 text-left">
성적 <span style="color: red;">B</span>
널널 <span style="color: red;">C</span>
강의 <span style="color: red;">B</span>
<span style="color: green;">(추천: 1)</span>
</div>
<div class="col-3 text-right">
<a onclick="return confirm('추천하시겠습니까?')" href="./likeAction.jsp?evaluationID=">추천</a>
<a onclick="return confirm('삭제하시겠습니까?')" href="./deleteAction.jsp?evaluationID=">삭제</a>
</div>
</div>
</div>
</div>
<div class="card bg-light mt-3">
<div class="card-header bg-light">
<div class="row">
<div class="col-8 text-left">알고리즘 <small>이순신</small></div>
<div class="col-4 text-right">
종합 <span style="color: red;">A</span>
</div>
</div>
</div>
<div class="card-body">
<h5 class="card-title">
강의력이 제일 좋은 강의입니다. <small>(2017년 2학기)</small>
</h5>
<p class="card-text">알고리즘 강의 가르치시는 교수님들 중에서 최고로 잘 가르치십니다.</p>
<div class="row">
<div class="col-9 text-left">
성적 <span style="color: red;">A</span>
널널 <span style="color: red;">C</span>
강의 <span style="color: red;">A</span>
<span style="color: green;">(추천: 0)</span>
</div>
<div class="col-3 text-right">
<a onclick="return confirm('추천하시겠습니까?')" href="./likeAction.jsp?evaluationID=">추천</a>
<a onclick="return confirm('삭제하시겠습니까?')" href="./deleteAction.jsp?evaluationID=">삭제</a>
</div>
</div>
</div>
</div>
</div>
<ul class="pagination justify-content-center mt-3">
<li class="page-item">
<a class="page-link" href="#">이전</a>
</li>
<li class="page-item">
<a class="page-link" href="#">다음</a>
</li>
</ul>
<div class="modal fade" id="registerModal" tabindex="-1" role="dialog" aria-labelledby="modal" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modal">평가 등록</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form action="./evaluationRegisterAction.jsp" method="post">
<div class="form-row">
<div class="form-group col-sm-6">
<label>강의명</label>
<input type="text" name="lectureName" class="form-control" maxlength="20">
</div>
<div class="form-group col-sm-6">
<label>교수명</label>
<input type="text" name="professorName" class="form-control" maxlength="20">
</div>
</div>
<div class="form-row">
<div class="form-group col-sm-4">
<label>수강 연도</label>
<select name="lectureYear" class="form-control">
<option value="2011">2011</option>
<option value="2012">2012</option>
<option value="2013">2013</option>
<option value="2014">2014</option>
<option value="2015">2015</option>
<option value="2016">2016</option>
<option value="2017">2017</option>
<option value="2018" selected>2018</option>
<option value="2019">2019</option>
<option value="2020">2020</option>
<option value="2021">2021</option>
<option value="2022">2022</option>
<option value="2023">2023</option>
</select>
</div>
<div class="form-group col-sm-4">
<label>수강 학기</label>
<select name="semesterDivide" class="form-control">
<option name="1학기" selected>1학기</option>
<option name="여름학기">여름학기</option>
<option name="2학기">2학기</option>
<option name="겨울학기">겨울학기</option>
</select>
</div>
<div class="form-group col-sm-4">
<label>강의 구분</label>
<select name="lectureDivide" class="form-control">
<option name="전공" selected>전공</option>
<option name="교양">교양</option>
<option name="기타">기타</option>
</select>
</div>
</div>
<div class="form-group">
<label>제목</label>
<input type="text" name="evaluationTitle" class="form-control" maxlength="20">
</div>
<div class="form-group">
<label>내용</label>
<textarea type="text" name="evaluationContent" class="form-control" maxlength="2048" style="height: 180px;"></textarea>
</div>
<div class="form-row">
<div class="form-group col-sm-3">
<label>종합</label>
<select name="totalScore" class="form-control">
<option value="A" selected>A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
<option value="F">F</option>
</select>
</div>
<div class="form-group col-sm-3">
<label>성적</label>
<select name="creditScore" class="form-control">
<option value="A" selected>A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
<option value="F">F</option>
</select>
</div>
<div class="form-group col-sm-3">
<label>널널</label>
<select name="comfortableScore" class="form-control">
<option value="A" selected>A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
<option value="F">F</option>
</select>
</div>
<div class="form-group col-sm-3">
<label>강의</label>
<select name="lectureScore" class="form-control">
<option value="A" selected>A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
<option value="F">F</option>
</select>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">취소</button>
<button type="submit" class="btn btn-primary">등록하기</button>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="modal fade" id="reportModal" tabindex="-1" role="dialog" aria-labelledby="modal" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modal">신고하기</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form method="post" action="./reportAction.jsp">
<div class="form-group">
<label>신고 제목</label>
<input type="text" name="reportTitle" class="form-control" maxlength="20">
</div>
<div class="form-group">
<label>신고 내용</label>
<textarea type="text" name="reportContent" class="form-control" maxlength="2048" style="height: 180px;"></textarea>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">취소</button>
<button type="submit" class="btn btn-danger">신고하기</button>
</div>
</form>
</div>
</div>
</div>
</div>
<footer class="bg-dark mt-4 p-5 text-center" style="color: #FFFFFF;">
Copyright ⓒ 2018 나동빈 All Rights Reserved.
</footer>
<!-- 제이쿼리 자바스크립트 추가하기 -->
<script src="./js/jquery.min.js"></script>
<!-- Popper 자바스크립트 추가하기 -->
<script src="./js/popper.min.js"></script>
<!-- 부트스트랩 자바스크립트 추가하기 -->
<script src="./js/bootstrap.min.js"></script>
</body>
</html>
▶ userLogin.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!doctype html>
<html>
<head>
<title>강의평가 웹 사이트</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- 부트스트랩 CSS 추가하기 -->
<link rel="stylesheet" href="./css/bootstrap.min.css">
<!-- 커스텀 CSS 추가하기 -->
<link rel="stylesheet" href="./css/custom.css">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="index.jsp">강의평가 웹 사이트</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbar">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="index.jsp">메인</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" id="dropdown" data-toggle="dropdown">
회원 관리
</a>
<div class="dropdown-menu" aria-labelledby="dropdown">
<a class="dropdown-item" href="userLogin.jsp">로그인</a>
<a class="dropdown-item" href="userRegister.jsp">회원가입</a>
<a class="dropdown-item" href="userLogout.jsp">로그아웃</a>
</div>
</li>
</ul>
<form action="./index.jsp" method="get" class="form-inline my-2 my-lg-0">
<input type="text" name="search" class="form-control mr-sm-2" placeholder="내용을 입력하세요.">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">검색</button>
</form>
</div>
</nav>
<div class="container mt-3" style="max-width: 560px;">
<form method="post" action="./userLoginAction.jsp">
<div class="form-group">
<label>아이디</label>
<input type="text" name="userID" class="form-control">
</div>
<div class="form-group">
<label>비밀번호</label>
<input type="password" name="userPassword" class="form-control">
</div>
<button type="submit" class="btn btn-primary">로그인</button>
</form>
</div>
<footer class="bg-dark mt-4 p-5 text-center" style="color: #FFFFFF;">
Copyright ⓒ 2018 나동빈 All Rights Reserved.
</footer>
<!-- 제이쿼리 자바스크립트 추가하기 -->
<script src="./js/jquery.min.js"></script>
<!-- Popper 자바스크립트 추가하기 -->
<script src="./js/popper.min.js"></script>
<!-- 부트스트랩 자바스크립트 추가하기 -->
<script src="./js/bootstrap.min.js"></script>
</body>
</html>
▶ userRegister.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!doctype html>
<html>
<head>
<title>강의평가 웹 사이트</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- 부트스트랩 CSS 추가하기 -->
<link rel="stylesheet" href="./css/bootstrap.min.css">
<!-- 커스텀 CSS 추가하기 -->
<link rel="stylesheet" href="./css/custom.css">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="index.jsp">강의평가 웹 사이트</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbar">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="index.jsp">메인</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" id="dropdown" data-toggle="dropdown">
회원 관리
</a>
<div class="dropdown-menu" aria-labelledby="dropdown">
<a class="dropdown-item" href="userLogin.jsp">로그인</a>
<a class="dropdown-item" href="userRegister.jsp">회원가입</a>
<a class="dropdown-item" href="userLogout.jsp">로그아웃</a>
</div>
</li>
</ul>
<form action="./index.jsp" method="get" class="form-inline my-2 my-lg-0">
<input type="text" name="search" class="form-control mr-sm-2" placeholder="내용을 입력하세요.">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">검색</button>
</form>
</div>
</nav>
<div class="container mt-3" style="max-width: 560px;">
<form method="post" action="./userRegisterAction.jsp">
<div class="form-group">
<label>아이디</label>
<input type="text" name="userID" class="form-control">
</div>
<div class="form-group">
<label>비밀번호</label>
<input type="password" name="userPassword" class="form-control">
</div>
<div class="form-group">
<label>이메일</label>
<input type="email" name="userEmail" class="form-control">
</div>
<button type="submit" class="btn btn-primary">회원가입</button>
</form>
</div>
<footer class="bg-dark mt-4 p-5 text-center" style="color: #FFFFFF;">
Copyright ⓒ 2018 나동빈 All Rights Reserved.
</footer>
<!-- 제이쿼리 자바스크립트 추가하기 -->
<script src="./js/jquery.min.js"></script>
<!-- Popper 자바스크립트 추가하기 -->
<script src="./js/popper.min.js"></script>
<!-- 부트스트랩 자바스크립트 추가하기 -->
<script src="./js/bootstrap.min.js"></script>
</body>
</html>
'JAVA & JSP' 카테고리의 다른 글
| JSP로 강의평가 웹 사이트 개발하기 ⑥ 회원가입 및 이메일 전송하기 (22) | 2018.01.26 |
|---|---|
| JSP로 강의평가 웹 사이트 개발하기 ⑤ 회원 데이터 모델링 (0) | 2018.01.26 |
| JSP로 강의평가 웹 사이트 개발하기 ④ 데이터베이스 구축하기 (2) | 2018.01.26 |
| JSP로 강의평가 웹 사이트 개발하기 ② 웹 디자인 기초 잡기 (5) | 2018.01.26 |
| JSP로 강의평가 웹 사이트 개발하기 ① 준비물 알아보기 (4) | 2018.01.21 |
JSP로 강의평가 웹 사이트 개발하기 ② 웹 디자인 기초 잡기
이번 시간은 JSP로 강의평가(Lecture Evaluation) 웹 사이트 개발하기 강좌의 두 번째 시간입니다. 지난 시간에는 강의평가 웹 사이트를 개발하기 위한 준비물에 대해서 알아보았습니다. 이번 시간은 웹 디자인을 해보도록 하겠습니다. 일반적으로 혼자서 웹 사이트를 개발할 때는 웹 서버 프로그램을 개발하기 전에 웹 디자인을 개발하는 것이 일반적입니다. 애초에 웹 디자인을 하기 위해서는 기본적인 설계가 잡혀있어야 되기 때문이지요. 바로 웹 디자인을 해보도록 하겠습니다.
웹 디자인을 완전히 제로베이스에서 하나하나씩 하면 힘이 들기 마련입니다. 그러므로 프레임워크와 라이브러리를 사용합시다.
1) 부트스트랩 프레임워크: http://getbootstrap.com/docs/4.0/getting-started/download/
위 사이트에 가서 bootstrap.min.css와 bootstrap.min.js를 다운로드하도록 합시다. 부트스트랩은 웹 디자인의 메인 프레임워크로 사용되는 경우가 많습니다. 다만 메인 프레임워크를 가동시키기 위해서는 여러 개의 추가적인 라이브러리가 필요할 수 있지요.
2) 파퍼(Popper) 라이브러리: https://unpkg.com/popper.js@1.12.9/dist/umd/popper.min.js
위 사이트로 가서 부트스트랩 프레임워크의 내부 로직에 사용되는 파퍼 자바스크립트 라이브러리를 다운로드 받아주세요.
3) 제이쿼리(jQuery) 라이브러리: https://jquery.com/download/
위 사이트에 가신 뒤에 jQuery 압축 버전을 다운로드 받아주세요. 부트스트랩은 jQuery 라이브러리의 다양한 함수를 사용하는 프레임워크이므로 jQuery 라이브러리가 포함되어야 정상적으로 사용할 수 있습니다.
이제 다음과 같이 이클립스 JEE를 실행하여 새로운 동적 웹 프로젝트를 생성해줍니다.
이후에 다음과 같이 Lecture Evaluation이라는 이름으로 하나의 프로젝트를 생성해주겠습니다.
그리고 다음과 같이 Lecture Evaluation 프로젝트 안에 css, js 폴더를 생성해서 그 안에 부트스트랩 프레임워크, jQuery 라이브러리, Popper 라이브러리를 모두 삽입해줍니다. 이후에 custom.css라는 이름으로 하나의 디자인 파일을 더 넣어줍니다. 여기에다가는 우리의 고유 디자인을 넣어 줄 겁니다. 바로 다음과 같이 프로젝트가 구성되도록 하면 됩니다.
custom.css 파일의 소스코드는 다음과 같이 작성해주겠습니다.
@import url(https://fonts.googleapis.com/earlyaccess/jejugothic.css);
@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);
.navbar-brand, h1, h2, h3, h4 {
font-family: 'Jeju Gothic';
}
h5 {
font-family: 'Jeju Gothic';
font-size: 18px;
}
body {
font-family: 'Nanum Gothic';
}
<!doctype html>
<html>
<head>
<title>강의평가 웹 사이트</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- 부트스트랩 CSS 추가하기 -->
<link rel="stylesheet" href="./css/bootstrap.min.css">
<!-- 커스텀 CSS 추가하기 -->
<link rel="stylesheet" href="./css/custom.css">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="index.jsp">강의평가 웹 사이트</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbar">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="index.jsp">메인</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" id="dropdown" data-toggle="dropdown">
회원 관리
</a>
<div class="dropdown-menu" aria-labelledby="dropdown">
<a class="dropdown-item" href="#">로그인</a>
<a class="dropdown-item" href="#">회원가입</a>
<a class="dropdown-item" href="#">로그아웃</a>
</div>
</li>
</ul>
<form class="form-inline my-2 my-lg-0">
<input class="form-control mr-sm-2" type="search" placeholder="내용을 입력하세요." aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">검색</button>
</form>
</div>
</nav>
<!-- 제이쿼리 자바스크립트 추가하기 -->
<script src="./js/jquery.min.js"></script>
<!-- Popper 자바스크립트 추가하기 -->
<script src="./js/popper.min.js"></script>
<!-- 부트스트랩 자바스크립트 추가하기 -->
<script src="./js/bootstrap.min.js"></script>
</body>
</html>
실행 결과는 다음과 같습니다.
'JAVA & JSP' 카테고리의 다른 글
| JSP로 강의평가 웹 사이트 개발하기 ⑥ 회원가입 및 이메일 전송하기 (22) | 2018.01.26 |
|---|---|
| JSP로 강의평가 웹 사이트 개발하기 ⑤ 회원 데이터 모델링 (0) | 2018.01.26 |
| JSP로 강의평가 웹 사이트 개발하기 ④ 데이터베이스 구축하기 (2) | 2018.01.26 |
| JSP로 강의평가 웹 사이트 개발하기 ③ 웹 디자인 개발하기 (1) | 2018.01.26 |
| JSP로 강의평가 웹 사이트 개발하기 ① 준비물 알아보기 (4) | 2018.01.21 |
JSP로 강의평가 웹 사이트 개발하기 ① 준비물 알아보기
안녕하세요, 이번에는 JSP로 강의평가(Lecture Evaluation) 웹 사이트를 개발해보도록 하겠습니다. 일반적으로 대부분의 학교에서는 매 학기마다 강의가 끝나면 학생들이 강의평가를 할 수 있게 해줍니다. 하지만 강의평가 내용을 학생들이 서로 공유할 수 있도록 해주지는 않습니다. 오직 교수님들만 그 평가 내용을 볼 수 있지요. 그렇기 때문에 학생들은 다음 학기 때 수강신청을 할 때 내가 신청하려는 강의가 어떠한 강의인지에 대해서는 쉽게 파악하지 못한다는 단점이 있습니다. 따라서 이번 강좌에서는 고등학교/대학교를 막론하고 어디에서도 적용될 수 있는 강의평가 웹 사이트를 개발하는 방법에 대해서 알려드리고자 합니다.
일반적으로 혼자 웹 사이트를 개발하고자 할 때의 프로세스는 다음과 같습니다.
① 개발환경 구축하기
② 웹 디자인 개발하기
③ 데이터베이스 구축하기
④ 웹 서버 프로그램 개발하기
⑤ 기능 테스트하기
⑥ 배포 및 유지보수
이번 강좌에서의 준비물은 다음과 같습니다. 개발환경이기도 하구요. 다음 포스팅 때부터 실제로 프로그래밍을 하기 위해서는 이러한 개발환경이 모두 구축이 되어 있어야 합니다. 이 강의는 가장 기본적인 개발환경 구축 능력이 있다고 가정하고 진행됩니다.
1) 웹 브라우저: 크롬(Chrome)
크롬(Chrome)은 웹 개발용 브라우저로 굉장히 유용합니다. F12를 눌러서 '개발자 도구'를 연 뒤에 새로고침 아이콘에 마우스 커서를 대고 마우스 우클릭을 하면 '캐시 비우기 및 강력 새로고침' 버튼이 있는데, 실제로 웹 개발 테스트를 할 때는 이것만 잘 눌러주시면 됩니다. 가끔 그냥 새로고침을 하면 톰캣 컨테이너에서의 수정 결과가 즉시 반영되지는 않는 경향이 있습니다. 그래서 캐시 비우기 및 강력 새로고침을 잘 해주시면 됩니다.
크롬 브라우저 다운로드 사이트: https://www.google.com/chrome/browser/desktop/index.html
또한 크롬 브라우저를 이용하면 각종 확장 프로그램(Extended Program)을 설치할 수 있다는 점에서 취약점 테스트, 쿠키 설정 확인 등에서 많은 도움을 받을 수 있습니다. 더군다나 최근 국내에서 가장 많이 사용되고 있는 브라우저라는 점에서 호환성 측면에서 보았을 때도 참 괜찮습니다.
2) 프로그래밍 개발 환경: 자바 개발 키트(JDK)
JDK는 자바 개발 키트(Java Development Kit)의 약자로서 JSP의 베이스가 되는 언어입니다. JDK를 설치함으로써 JSP를 구동시킬 수 있습니다.
JDK 다운로드 사이트: http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
3) JEE 개발 환경: 이클립스(Eclipse)
JEE 개발 환경으로는 넷빈즈(NetBeans) 등이 있는데, 아무래도 국내에서는 그래도 이클립스가 상당히 많이 사용되고 있습니다. 특히 이클립스의 스프링(Spring) 플러그 인도 굉장히 활용 빈도가 높기 때문에 처음부터 이클립스로 실습을 시작하는 것이 좋습니다.
이클립스 다운로드 사이트: http://www.eclipse.org/
4) 데이터베이스: MySQL
아무래도 상당수의 웹 호스팅 서비스에서 MySQL을 지원해주고 있다는 점과 기본적으로 무료로 커뮤니티 버전을 사용할 수 있다는 점에서 MySQL이 웹 프로젝트용으로 채택되기에 안성맞춤입니다.
MySQL 다운로드 사이트: https://dev.mysql.com/downloads/windows/installer/5.7.html
5) 웹 컨테이너: 톰캣(Tomcat)
톰캣은 대표적인 JSP & Servlet 전용 웹 컨테이너입니다. 이클립스 개발 환경 위에서 자바로 작성된 웹 프로젝트를 실제로 구동시켜볼 수 있으며 무료라는 점에서 가장 많이 채택이 되어 사용되고 있습니다.
톰캣 다운로드 사이트: https://tomcat.apache.org/download-80.cgi
'JAVA & JSP' 카테고리의 다른 글
| JSP로 강의평가 웹 사이트 개발하기 ⑥ 회원가입 및 이메일 전송하기 (22) | 2018.01.26 |
|---|---|
| JSP로 강의평가 웹 사이트 개발하기 ⑤ 회원 데이터 모델링 (0) | 2018.01.26 |
| JSP로 강의평가 웹 사이트 개발하기 ④ 데이터베이스 구축하기 (2) | 2018.01.26 |
| JSP로 강의평가 웹 사이트 개발하기 ③ 웹 디자인 개발하기 (1) | 2018.01.26 |
| JSP로 강의평가 웹 사이트 개발하기 ② 웹 디자인 기초 잡기 (5) | 2018.01.26 |
하나의 구글 애드센스에 유튜브 여러 개를 연결할 수 있을까?
정답은 '할 수 있다' 입니다. 구글 애드센스를 이용하면 유튜브 동영상이나 블로그 등에 광고를 달아서 광고 수익을 창출할 수 있습니다. 기본적으로 1인당 가질 수 있는 구글 애드센스 계정은 단 한 개입니다. 그렇지만 그렇게 만든 애드센스 계정에는 여러 개의 컨텐츠가 달릴 수 있는 것입니다. 저 또한 제 구글 애드센스 계정이 이미 존재합니다. 현재 구글 애드센스 계정에는 이미 하나의 유튜브가 달려있습니다. 로그인 되어 있는 상태구요.
'계정 추가'를 눌러서 다른 계정도 쉽게 로그인할 수 있도록 해줍니다. 이 때 다른 유튜브 계정이 이미 존재해야 하는 상황입니다. 이 새로운 계정을 기존의 애드센스에 추가적으로 추가해주는 것입니다.
바로 위와 같이 로그인을 해서 계정을 추가할 수 있습니다.
새로운 계정을 추가하면 위와 같이 해당 계정으로 로그인이 되며 기존에 로그인되어 있던 다른 계정은 '다른 계정'으로 분류되어서 쉽게 계정을 전환할 수 있는 형태가 됩니다.
이후에 크리에이터 스튜디오로 이동해서 '수익 창출'을 사용으로 바꾸어줍니다.
그러면 이러한 화면으로 전환됩니다.
이제 차례대로 전부 수행해주면 위와 같은 상태가 됩니다. 저는 이미 새롭게 추가하는 채널의 조회수가 10,000 회가 넘었기 때문에 이렇게 간단하게 바로 검토를 시작합니다. 조회수가 10,000회가 넘지 않았다면 조회수가 10,000회가 넘은 뒤부터 검토가 시작된다고 합니다. 이렇게 사실 이미 애드센스 계정이 있는 사람이라면 아주 간단하게 새로운 유튜브 계정을 추가할 수 있습니다!
'IT 마케팅 전략' 카테고리의 다른 글
| 블로그에 구글 애드센스를 달 때 유의할 점을 알아보자! (애드센스 정책) (0) | 2017.04.23 |
|---|---|
| 유튜브나 블로그에서 광고 수익 내는 방법 총 정리 (구글 애드센스, 네이버 애드포스트) (0) | 2017.04.22 |
운영체제가 컴퓨터를 작동 시키는 과정을 알아보자!
운영체제 강좌 4강 - 컴퓨터의 작동 과정
※ 컴퓨터 시스템에서 CPU와 각 장치들은 서로 연결되어 메모리를 공유합니다. 각각의 장치마다 장치 제어기(Controller)가 작업을 도와주며 모든 기계들은 동기화되어 적절히 작동합니다.
※ 컴퓨터의 부팅 과정
- 전원이 켜질 때 ROM에 저장된 초기 프로그램을 실행합니다.
- 초기 프로그램은 메모리, CPU 레지스터 등을 초기화시킵니다.
- 이후에 운영체제를 찾아서 메모리에 적재합니다.
- 운영체제는 첫 번째 프로세스를 즉시 실행합니다.
- 인터럽트가 발생하면서 CPU가 각종 작업을 처리합니다.
※ 하드웨어와 소프트웨어는 모두 CPU에 인터럽트를 발생시킬 수 있습니다. 일반적으로 인터럽트는 입출력 연산이 종료되었을 때, 예외가 발생했을 때, 운영체제의 다양한 서비스를 요구할 때 등 다양한 이유로 발생할 수 있습니다.
※ 인터럽트가 발생했을 때 CPU는 현재 하던 일을 중단하고, 그 인터럽트에 대한 처리를 먼저 하게 됩니다. 그러한 처리를 '서비스 루틴‘이라고 하며 일반적으로 OS가 이를 처리합니다. 서비스 루틴이 종료가 되면 다시 CPU는 인터럽트 되었던 그 연산을 재개합니다.
※ 인터럽트가 요청되었을 때 처리할 수 있는 방법은 2가지입니다.
(방법 1)
- 운영체제가 어떠한 종류의 인터럽트인지 확인합니다.
- 인터럽트 핸들러(Handler)를 호출해서 인터럽트를 처리합니다.
(방법 2)
- 인터럽트가 요청이 되면 인터럽트 서비스 루틴의 주소를 가리키는 포인터들로 구성된 인터럽트 벡터 테이블을 참조합니다.
- 참조된 포인터가 가리키는 인터럽트 처리 루틴을 호출해서 인터럽트를 처리합니다.
※ 최근에는 방법 2를 채택한 운영체제가 많습니다. 인터럽트가 발생하면, OS는 하던 일에 대한 정보를 저장하고 중단합니다. 인터럽트 벡터로 제어를 옮겨 요청한 인터럽트 처리 루틴의 주소를 가리키는 포인터를 참조합니다. 포인터를 따라 이동하여 인터럽트 처리 루틴을 완료한 뒤에 다시 하던 일로 돌아갑니다.
※ 인터럽트가 실행이 되고 있을 때 다른 인터럽트가 또 발생하는 경우에는 다른 인터럽트들을 대기시킵니다. 대기를 시키는 이유는 데이터 소실을 막기 위함입니다. 또한 인터럽트 사이에는 우선순위가 있어서 우선순위에 따라서 인터럽트 처리 순서를 조절합니다.
'운영체제' 카테고리의 다른 글
| 운영체제 시작하기 (0) | 2019.05.01 |
|---|---|
| 다양한 컴퓨터 시스템을 소개합니다! (0) | 2017.04.22 |
| 컴퓨터 시스템의 발전 양상을 살펴보자! (0) | 2017.04.22 |
| 운영체제란 무엇일까? (0) | 2017.04.22 |
블로그에 구글 애드센스를 달 때 유의할 점을 알아보자! (애드센스 정책)
티스토리 블로그(Tistory Blog) 등에는 구글 애드센스를 달아서 블로그가 수익을 창출할 수 있도록 허용해줍니다. 다만 구글 애드센스를 승인 받더라도 구글 애드센스 정책을 바르게 따르지 않으면 애드센스 계정이 정지될 수 있다고 합니다. 제 주변 많은 블로거들은 실수로 자신이 애드센스를 몇 번 클릭했다는 사유만으로도 부정 트래픽으로 구글에서 메일이 날라오고, 구글 애드센스 계정이 정지됬다고 썰을 풀곤 합니다. 따라서 이러한 불상사를 막기 위해서는 구글 애드센스를 달 때의 유의점에 대해서 공부할 필요가 있습니다. 일단 먼저 구글 애드센스를 통한 수익을 확인하는 방법을 소개하겠습니다.
※ 구글 애드센스를 통한 수익 확인 방법
먼저 자신의 구글 애드센스 관리자 페이지로 이동합니다. https://www.google.com/adsense/
이후에 위와 같이 '실적 보고서' → '일반 보고서' → '광고 제품'으로 들어가서 수입을 확인할 수 있습니다.
여기에서 저 같은 경우는 '호스팅된 콘텐츠용 애드센스'와 '콘텐츠용 애드센스' 두 개가 있는데 여기서 호스팅된 콘텐츠라고 함은 유튜브에서 창출된 수익을 의미합니다. 반면에 지금 제 블로그와 같이 제가 직접 광고를 소스코드 상으로 게재하는 것은 콘텐츠용 애드센스에 들어갑니다. 이렇게 구별되어서 나오는 것을 알 수 있습니다.
※ 구글 애드센스에서 금기시하는 정책
구글 애드센스에서 금기시하는 정책은 위와 같습니다. 기본적으로 구글에서는 다소 애드센스를 엄격하게 다루고 있는데 이는 애드센스 달고 나서 아이피를 우회하고 다른 사용자를 개입시켜서 고의적으로 트래픅을 늘리는 사람들이 존재하기 때문입니다. 따라서 본인의 사이트에 게재된 광고를 직접 클릭하거나 일부러 클릭을 유도하는 경우 강한 제재를 받을 수 있다고 합니다. 또한 구글 애드센스 자체가 일을 빠르게 처리하는 편이 아니라서 계정을 다시 사용할 수 있도록 허락받거나 사실을 입증하기 위해서는 많은 노력이 필요합니다. 따라서 웬만하면 미리 조심해서 구글 애드센스 정책에 걸리지 않도록 하는 것이 중요합니다.
※ 만약 광고 정지를 당했다면 어떻게 대처할까?
바로 자신의 구글 애드센스 계정으로 접속한 뒤에 도움말에 들어갑니다.
이후에 '이의'만 입력해도 이의 신청 관련 방법이 나옵니다.
위와 같이 '정책 위반 이의신청 문제해결 도구'를 눌러서 관련 사이트로 이동하도록 합니다.
위와 같이 양식을 작성해서 이의신청을 할 수 있습니다. 하지만 전반적으로 한 번 정지를 당하면 다시 풀기는 굉장히 어렵기 때문에 항상 정책을 준수하면서 글을 작성하도록 합니다. :)
'IT 마케팅 전략' 카테고리의 다른 글
| 하나의 구글 애드센스에 유튜브 여러 개를 연결할 수 있을까? (0) | 2017.04.30 |
|---|---|
| 유튜브나 블로그에서 광고 수익 내는 방법 총 정리 (구글 애드센스, 네이버 애드포스트) (0) | 2017.04.22 |
유튜브나 블로그에서 광고 수익 내는 방법 총 정리 (구글 애드센스, 네이버 애드포스트)
이번에 다룰 내용은 블로그나 유튜브를 이용해서 마케팅을 하여 돈을 버는 방법을 전반적으로 이야기할 것입니다. 또한 나아가서 구글 애드센스 및 각종 광고를 삽입하는 방법을 폭 넓게 알려드리려고 합니다. 다소 구체적인 부분 보다는 광고 수익에 대한 전체적인 틀을 설명하고자 합니다. 저는 블로그를 시작한지 일 년하고도 반 정도가 지났습니다. 2015년 9월 가량에 처음 블로그를 시작했습니다. 제가 블로그를 시작하고 2016년 초가 되었을 때는 블로그라는 것을 이용해서 돈을 벌 수 있다는 것을 깨달았습니다. 블로그를 시작하고 3개월 가량 지났을 때 어느 순간부터 제 블로그에 500명 이상이 매일매일 들어왔기 때문이에요. 그래서 매일매일 이상한 광고 관련 쪽지도 오고 제 블로그에 어떤 글을 올려주면 광고비를 준다 메일도 오고 했습니다. 물론 처음에는 굉장히 소액이었어요. 그래도 관심이 생겨서 이것저것 해보다 보니까 블로그로 마케팅을 잘 하는 사람은 돈을 많이 받을 수 있다는 사실을 알게 되었습니다.
제가 블로그를 시작하고 3개월 가량 지난 초창기의 수익 구조를 정리하면 대략 다음과 같습니다. 이 때는 오직 블로그만 하던 시기라서 네이버 블로그에 한정되어 있답니다.
1) 블로그에 광고 글을 올려주면 광고사가 직접 돈을 주는 구조 : 보통 한 건에 적으면 만 원부터 많으면 십 오만 원 정도의 돈을 받을 수 있었습니다.
2) 네이버에서 제공하는 네이버 애드센스 : 네이버에서 제공하는 정식 애드센스로서 블로그의 아래 쪽에 달리고 이것을 선택하거나 들어가서 물건을 구매하는 경우 네이버가 정식으로 돈을 주는 방식입니다.
애드포스트 같은 경우는 상당히 신청하는 절차가 간단합니다. 네이버 애드포스트 사이트에 접속하신 이후에 신청 하시고 자기 블로그 쓰시면 수 일 내로 작업이 이루어집니다. 사실 네이버는 신청하기가 굉장히 쉬워서 자기 블로그만 잘 나간다면 그다지 걱정하실 게 없어요. 따라서 네이버 애드포스트에 관해서는 신청 방법을 자세하게 다루지 않을 생각이랍니다.
위 사진은 제 현재(2017년 4월 21일) 네이버 애드포스트 현황입니다. (정말 처참합니다.) 하루에 300명 들어오는 블로그가 되어버린 지금 하루에 30원씩 벌리고 있답니다! 50원짜리 초콜릿 또또또도 못 사먹는 막강한 금액입니다. 물론 옛날에 한 순간 하루에 15,000 명 정도 들어올 때는 하루에 8,000원 가량 벌리고는 했습니다. 네이버 애드포스트는 그다지 수익이 높은 편은 아니랍니다. 하루 만 명 넘을 때도 하루에 만 원을 못 버는게 현실이었거든요. 제가 생각하기로는 네이버 애드포스트는 정말 잘 나가는 블로그도 다른 광고 서비스에 비해서 큰 수익을 내지 못하는 것 같습니다. (구글 애드센스나 기타 개인 광고 업체와 비교했을 때 반의 반 토막이 조금 안 되는 것 같습니다.)
2016년 2월에서 3월 가량에는 위 두 방식으로 저도 마케팅을 계속 진행하다가 네이버 애드포스트로는 큰 수익성을 찾지 못해서 제가 계속 광고성 글을 올리게 되니까 네이버 측에서 광고성 블로그로 구분을 했는 지 방문자 수가 폭락해서 몇 천 명 들어오던 블로그가 200 ~ 300명 가량이 하루에 들어오는 작은 규모의 블로그로 바뀌게 되었습니다. 현재는 광고성 글은 전혀 게재를 하지 않고 다시 IT 관련 포스팅만 하고 있습니다. (사실 최근에는 블로그 보다는 유튜브를 많이 하고 있는 상황이에요.) 또한 추가적으로 네이버 TV 캐스트나 네이버 애드포스트는 오직 네이버에 올리는 글을 대상으로 가능하게 합니다. 반면에 구글 애드센스는 티스토리 블로그나 유튜브에 적용이 가능합니다.
그래서 당분간 IT 블로그나 마케팅 쪽에는 아예 관심을 끄고 살다가 유튜브를 시작하게 되었는데요, 유튜브는 또 유튜브 나름대로 구글 애드센스라는 것이 있다는 것을 알게 되었습니다. 애초에 유튜브는 구글 소속이라서 유튜브 광고 수익을 유튜버와 분배할 수 있도록 해주는 것이지요. 그래서 동영상으로 아예 전향해서 유튜브에 많은 프로그래밍 강좌를 찍어서 올렸답니다! 그러다가 어느 정도 조회수가 되어서 한 번 여기에다가 구글 애드센스를 달아볼까 해서 달게 되었습니다.
위 사진은 현재(2017년 4월 21일) 기준의 제 유튜브 계정입니다. 보시면 한 달에 50달러 가량이 벌리고 있는 것을 알 수 있어요. 하루에 1500원 가량 벌리는 것입니다. 제가 투자하는 시간에 비하면 최저 시급의 반의 반 토막도 안 됩니다. (물론 IT 강의는 정말 제 개인적인 교육 욕심이고 수익 자체를 목표로 하지 않고 있습니다. 수익을 목표로 했으면 각종 사회 이슈 막무가내로 잡아 올리는 방식으로 조회수 늘리기를 목표로 삼았겠지요.) 아무튼 이처럼 유튜브 수익도 처참하지만 그래도 한 달에 한국 돈으로 5만원이면 인간적인 금액이라고 생각합니다. 유튜브 수익은 일반적으로 조회수마다 1원이라고 생각하시면 되요. 이보다 더 크거나 적을 수는 있답니다.
결과적으로 블로그나 유튜브로 광고 수익을 내기 위해서는 일단 컨텐츠가 있어야 합니다. 제 생각으로는 그래도 블로그라면 글 50개 이상은 올린 블로그, 유튜브라면 동영상 30개 이상은 올린 유튜브가 되어야 합니다. (일반적인 기준에서) 그리고 실제 많은 유튜버들은 수익을 목적으로 정말 악마의 편집과 같은 질 나쁜 컨텐츠를 양산하고는 하는데요, 남에게 보여줘도 부끄럽지 않은 올바른 컨텐츠를 만들어야 한다고 생각해요. 저는 IT 관련 강의로 수익은 적어도 나름 정정 당당하게 승부하고 있다고 생각합니다. 아무튼 이제 이런식으로 컨텐츠가 구비되었다고 가정해볼게요. 그 이후에는 아래 사이트로 갑니다.
https://www.google.co.kr/adsense/start
구글 애드센스는 위 사이트에서 신청할 수 있습니다. 들어가셔서 '가입하기' 버튼을 누르시면 아래와 같이 절차에 따라서 신청할 수 있습니다.
위 절차에 따라서 신청하고 가입 후 '예'를 누르면 웹 사이트를 등록하라고 나옵니다. 이 때 티스토리 블로그라면 티스토리 블로그를 넣으시고, 유튜브라면 유튜브 채널 주소를 입력하는 등 절차에 맞게 진행하시면 쉽게 등록이 가능합니다. 그러면 수 일 내로 구글에서 메일이 도착해서 성공 여부를 알려줘요. 티스토리 블로그 같은 경우는 한 번의 포스팅에 대략 천 자가 넘는 포스팅으로 지속적으로 글이 올라오는 지 등의 여부로 통과시킨다고 해요. 유튜브 또한 어느 정도 조회수나 광고 가치가 있어야 하구요. 대략적으로 구글 애드센스는 위와 같은 방법으로 신청 가능합니다.
다음은 네이버 TV 캐스트에서 대해서 말씀드릴게요. 이거는 동영상에 한정되어 있는 건데요, 각종 강의 동영상이나 웹 드라마를 만드는 사람들은 네이버 TV 캐스트와 같은 서비스에서 광고 수익을 얻을 수 있습니다. 네이버 TV 캐스트는 아래 사이트에 접속해서 신청할 수 있습니다. 네이버 TV 캐스트는 제휴라는 과정을 거쳐요. 제가 만든 동영상이 네이버 측에서도 광고 수익을, 제 입장에서도 광고 수익을 얻을 수 있는 지 평가하는 겁니다. 아래 링크는 네이버 TV 신청을 하는 방법을 소개해주는 사이트입니다.
https://www.navercorp.com/ko/company/proposalGuide.nhn
저는 그래서 "제가 올린 IT 강좌가 어느 정도 사람들이 볼 것이고 광고 수익이 나올 것이다~" 이런 식으로 사업 제휴 신청서를 작성해서 업로드했더니 며칠 만에 등록이 되어서 아래와 같이 채널을 개설할 수 있었습니다. 이것도 그냥 하라는 대로 하면 생각보다 되게 금방 신청할 수 있습니다. 다소 작성할 것들이 많게 느껴질 수 있는데 시간이 조금 소요될 뿐 난이도는 그렇게 높지 않습니다. 아래는 제 네이버 TV 캐스트 메인 사이트입니다.
시간이 지나고 채널을 개설해서 위와 같이 꾸밀 수 있습니다. 네이버 TV는 약 조회수가 1개 정도 될 때마다 5원에서 10원 가량이 벌립니다. 또한 네이버 TV는 다소 신설된 서비스라서 현재는 굉장히 서비스를 키우고 있는 추세라는 것에 집중할 필요가 있습니다. 네이버 애드포스트와 같은 다른 기존의 광고 서비스에 비해서 우리에게 배정되는 광고 수익이 상당히 높은 것입니다. 네이버 TV는 3월부터 시작했는데 약 1달 정도 지난 지금 6,000명 정도가 보았으므로 3 ~ 5만원 가량의 수익이 발생할 것으로 예상됩니다. 제 예상에는 네이버 TV 또한 나중에 대세에 편승할 것 같습니다. 아무튼 이번 포스팅에서는 전반적인 광고 수익 구조를 설명하고 다양한 광고 수익 산출 방법에 대해서 알아보았습니다. 사실 저는 수익성 블로그를 운영해보거나 하지 않아서 그다지 수익을 많이 벌지는 못합니다. 사소한 재미 정도로 이렇게 운영하고 있는데 나름 애착이 가는 제 개인 활동입니다. ㅎ-ㅎ
※ 요약 ① - 수익률 : 네이버 애드포스트 < 구글 애드센스 < 넘사벽 < 네이버 TV 캐스트
요약 ② - 신청 난이도 : 네이버 애드포스트 < 구글 애드센스 = 네이버 TV 캐스트
요약 ③ - 실제 수익 정산 난이도 : 네이버 애드포스트(자동으로 해줌) < 구글 애드센스(핀 번호를 입력해야 하는데 도착하는 데 시간이 많이 걸림) < 네이버 TV 캐스트(세금 관련 사항 등 신경쓸게 많음)
요약 ④ - 처음부터 수익을 보고 컨텐츠를 운영하기보다는 자신이 좋아하는 주제로 오랫동안 다룰 수 있는 내용으로 블로그 포스팅을 하거나 유튜브에 올려야 자기 만족도가 높습니다.
요약 ⑤ - 네이버 애드포스트 : 네이버 블로그
구글 애드센스 : 티스토리 블로그, 유튜브
네이버 TV : 네이버 TV 제휴 동영상 신청 후 등록된 동영상들
'IT 마케팅 전략' 카테고리의 다른 글
| 하나의 구글 애드센스에 유튜브 여러 개를 연결할 수 있을까? (0) | 2017.04.30 |
|---|---|
| 블로그에 구글 애드센스를 달 때 유의할 점을 알아보자! (애드센스 정책) (0) | 2017.04.23 |
다양한 컴퓨터 시스템을 소개합니다!
운영체제 강좌 3강 - 다양한 시스템
※ 다중 처리 시스템(Multiprocessor System) : CPU가 여러 개인 시스템을 의미하며 각각의 CPU들이 아주 밀접하게 통신을 하는 구조를 가지고 있습니다. 당연히 성능이 하나의 CPU가 있을 때보다 더 좋으며 하나의 처리기가 고장이 나더라도 속도가 느려질 뿐 시스템은 정상적으로 작동합니다.
- 대칭적 다중 처리 시스템 : 각 CPU가 하나의 운영체제 하에서 작동합니다. 또한 CPU끼리 데이터를 효율적으로 공유하는 구조로 운용이 됩니다.
- 비대칭적 다중 처리 시스템 : 각 처리기마다 특정한 작업이 정해져 있고 하나의 주요 CPU가 시스템을 제어하며 다른 CPU들은 미리 정의된 작업 혹은 명령을 수행합니다.
※ 분산 처리 시스템(Distributed Processing System) : 네트워크를 이용해 동시에 작업을 처리하는 시스템으로 각각 CPU들은 메모리를 공유하지 않습니다. 당연히 적절한 자원 공유로 계산 속도가 증가하고 신뢰성이 증가합니다.
- 클라이언트 & 서버 시스템(Client & Server System) : 클라이언트가 서버로 어떠한 작업 요청을 보내고 서버는 그 작업을 수행해서 다시 클라이언트에게 응답을 보내는 구조입니다. 대표적으로 웹 사이트와 접속자 사이의 관계를 이야기할 수 있습니다.
- P2P 시스템(Peer-To-Peer System) : 각 컴퓨터가 서버이자 클라이언트가 되는 시스템으로서 대표적인 예시로 토렌트(Torrent) 서비스가 있습니다.
※ 클러스터 시스템(Clustered System) : 물리적으로 많은 CPU를 한 곳에 모아서 특정한 작업을 수행하는 시스템입니다. LAN으로 서로 연결된 각각의 CPU는 다른 CPU와 상호작용하여 고속 처리 서비스를 지원하게 됩니다.
- 대칭적 클러스터 시스템 : 각각의 CPU가 호스트가 되어 서로를 관리하는 구조로 둘 이상의 작업을 수행할 수 있습니다.
- 비대칭적 클러스터 시스템 : 호스트 CPU가 다른 CPU를 관리하면서 특정한 CPU가 작동을 중지하면 호스트 CPU가 작업을 돕는 구조입니다.
※ 실시간 시스템(Real-Time System) : 실시간 시스템은 CPU의 동작이나 작업이 즉시적인 처리를 요할 때 채택되는 시스템입니다. 주로 의학 영상 시스템이나 무기 시스템에 실제로도 굉장히 많이 사용되고 있습니다.
- 연성 실시간 시스템(Soft Real-Time System) : 더욱 우선순위를 가지고 빠르게 계산이 되긴 해야 하지만 절대적으로 시간만을 중요시하지는 않는 시스템으로 일반 컴퓨터에도 많이 녹아 있는 구조입니다. 음악 등을 들을 때는 웬만하면 컴퓨터가 렉이 걸려도 끊이지 않습니다.
- 경성 실시간 시스템(Hard Real-Time System) : 빠른 시간이 절대적으로 요구되는 시스템으로 단기 메모리만 써서 시간 엄수를 최우선적으로 끌어 올립니다. 예를 들어 정밀하고 신속한 위치 판별을 요구하는 미사일 발사 시스템을 이야기할 수 있습니다.
'운영체제' 카테고리의 다른 글
| 운영체제 시작하기 (0) | 2019.05.01 |
|---|---|
| 운영체제가 컴퓨터를 작동 시키는 과정을 알아보자! (0) | 2017.04.23 |
| 컴퓨터 시스템의 발전 양상을 살펴보자! (0) | 2017.04.22 |
| 운영체제란 무엇일까? (0) | 2017.04.22 |
컴퓨터 시스템의 발전 양상을 살펴보자!
운영체제 강좌 2강 - 시스템의 발전
※ 시스템의 발전에서 주요하게 꼽히는 부분은 바로 일괄처리 시스템에서 다중 프로그램 & 시분할 시스템으로의 발전입니다.
※ 일괄처리 시스템 (Batch System) : 초기의 컴퓨터가 동작하는 방식으로서 물리적으로 콘솔에서 수행을 하던 방식에 사용하던 시스템입니다. 초기의 운영체제는 즉시적으로 데이터를 처리할 수 있는 여건 또한 갖추지 못했습니다. 따라서 그 대안으로 일괄처리 시스템이 운영체제에 도입이 됨으로써 비슷한 것은 주기적으로 한 번에 묶어서 처리할 수 있게 되었습니다.
일괄처리 시스템은 처리 속도를 향상시키기 위해서 유사한 요구를 가지는 작업들을 함께 모아서 이들을 하나의 그룹으로 수행합니다. 다만 기계적인 입/출력 장치의 속도가 CPU와 같은 전자적인 장치의 속도보다 느리기 때문에 CPU가 계속해서 쉬는 상태(idle)인 경우가 많습니다.
※ 다중 프로그램 시스템 (Multi-Programmed System) : CPU가 수행할 작업을 항상 가지도록 하는 방식입니다. 먼저 하드 디스크나 SSD에서 여러 개의 프로그램을 선택해서 메인 메모리(RAM)에 적재합니다. 이후에 메모리 내에 있는 작업 중에서 하나를 선택해 차례대로 실행합니다. 이 때 수행 중인 작업이 입/출력 등 때문에 기다리는 상태에 도달하면 CPU는 다른 작업으로 넘어가서 수행을 계속합니다. 이후에 첫 번째 작업이 끝나면 현재의 작업을 중단하고 다시 첫 번째 작업이 CPU를 차지하게 되는 방식입니다.
다중 프로그램 시스템 덕분에 프로그램에서 카드를 읽거나 프린터를 쓰는 등의 시간에도 CPU를 계속해서 사용할 수 있게 되었습니다.
※ 시분할 시스템 (Time-Sharing System) : 다중 프로그래밍의 장점을 채택하여 확장한 시스템으로서 프로그램이 수행이 되고 있을 때 아주 짧은 주기로 CPU를 각각의 프로그램에 할당을 해 주는 방법입니다. 시분할 시스템으로 사용자는 프로그램이 수행이 되고 있는 동안에도 상호작용(Interact)할 수 있게 됩니다. 아주 짧은 주기로 전환이 이루어지기 때문에 각 사용자는 모든 프로그램이 동시에 작동을 하고 있다고 느끼게 됩니다.
예를 들면 리눅스(Linux)와 같은 운영체제는 여러 명의 사용자가 동시에 한 대의 컴퓨터에 접속을 해서 서로 다른 처리를 할 수 있도록 해주는데 이는 시분할 시스템을 적절하게 반영한 사례라고 할 수 있습니다.
※ 작업 스케줄링 : 보조기억장치에 프로그램에 저장되어 있고 그 중 일부를 선택해서 메모리에 적재하는 전략입니다.
※ CPU 스케줄링 : 메모리에 올라온 작업들 중에서 무엇부터 실행할지 고르는 전략입니다.
※ 일괄처리 시스템은 상호작용이 필요 없는 큰 단위의 작업들을 수행할 때 사용이 됩니다.
'운영체제' 카테고리의 다른 글
| 운영체제 시작하기 (0) | 2019.05.01 |
|---|---|
| 운영체제가 컴퓨터를 작동 시키는 과정을 알아보자! (0) | 2017.04.23 |
| 다양한 컴퓨터 시스템을 소개합니다! (0) | 2017.04.22 |
| 운영체제란 무엇일까? (0) | 2017.04.22 |
