Computer Science
[Data Structure] Linked List (연결 리스트)
[Data Structure] Linked List (연결 리스트)
2021.03.03Linked list (연결 리스트) 링크드 리스트와 배열 Linked list (연결 리스트)와 가장 많이 비교되는 자료구조에는 Array (배열)가 있다. 두 자료구조 모두 linear order data structure로, 선형 저장구조를 갖고 있다. 선형 저장구조를 갖고 있다는 의미는 데이터 간의 전후관계가 존재한다는 의미와도 같다. 두 자료구조의 차이점에는 데이터 접근성과 size의 변동성이 있다. Array (배열) 배열은 임의의 인덱스에 빠르게 접근이 가능하다. 접근하고자 하는 index를 알기만 하면 O(1)시간에 접근이 가능하다. 배열을 선언할 때 memory를 선언하고 할당하기 때문에 제한된 메모리 크기를 갖는다. 그로인해 한 번 선언한 배열의 크기는 변경 할 수 없다는 단점이 있다...
[Web] SNS형 게시판 만들기 프로젝트 (5) - JSP 사용하기
[Web] SNS형 게시판 만들기 프로젝트 (5) - JSP 사용하기
2020.05.28$ 개발환경은 Mac OS Catalina임을 알려드립니다. $ 이번에는 JSP사용과 톰캣9 설치 과정을 설명해드리겠습니다. 제가 사용하는 건 맥북이라 좀 까다로운 편이니 이해해주시길 바랍니다. 우선 JSP가 뭔지를 알아야 합니다. JSP란 Java Server Page의 약자로서 일반적인 HTML과 다르게 PHP처럼 동적인 웹 개발이 가능하게 만들어준 스크립트 언어입니다. 일반적으로 JSP를 사용하기 위해서 Apache Tomcat과 연동을 해서 사용하는 경우가 많습니다. 톰캣이 해주는 역할은 JSP코드를 Servelet Class로 변환해서 실행을 시켜주는 역할을 합니다. JSP의 동작원리는 일반적으로 Model2를 활용하게 됩니다. JSP가 실행이 되면 우선 Web container로 해당 파일이 ..
[Web] SNS형 게시판 만들기 프로젝트 (4) - Java Script 사용
[Web] SNS형 게시판 만들기 프로젝트 (4) - Java Script 사용
2020.05.17$ 개발 환경은 Mac OS Catalina임을 알려드립니다 $ 오랜만에 Web관련 포스팅을 합니다. CSS설정는 사실 내용적인 부분이 암기가 많습니다. 그래서 개발할 때는 W3school을 참조하는 게 좋습니다. 내용이 너무 방대하니까요. 이제 좀 더 코딩적인 요소에 가까운 JavaScript와 JSP에 대해서 알아봅시다. 이번주 과제는 JavaScript를 활용해서 게시글 업로드를 하고 사용자가 입력한 내용을 출력시켜서 보여주면 되는 것과 form에서 입력한 결과를 alert에서 보여주는 처리를 해주면 됩니다. 우선 좀 쉬운 2번 과제부터 진행해봅시다. form태그에 기록할 수 있는 대부분의 내용들을 입력을 받고 해당 내용을 alert로 출력해주면 됩니다. 우선 form태그 형식을 짜봅시다. inpu..
[Web] HTML / CSS /JavaScript 내용 정리
[Web] HTML / CSS /JavaScript 내용 정리
2020.05.03시험공부용 HTML / CSS3 / JavaScript 내용 정리본입니다. > HTML 태그 - 태그 내부에 아무리 많은 공백을 입력해도 무시함 -> 사용해서 공백 적용 - 태그 사용하면 적은 그대로 출력해줌. 공백, 줄 바꿈 모두 적용. - 숫자 클수록 작은 제목 적용 - 구분선 - 볼드체, 이텔릭체 - 태그(목록 태그) 하위에, 항목은 태그로 추가한다. 해당 목록들은 넘버링이 없음. 태그 내부에 태그 추가 가능함. - 태그(목록 태그)는 과 동등하게 사용하지만 넘버링이 붙는다. 넘버링 종류는 type=””으로 결정해주면 된다. Start값 설정해주면 해당 번호부터 시작한다. > value 사용해서 중간에 낚아채기도 가능. - 로 제목, 설명 가능 - 에서는 target값에 따라 링크 ..
[Web] SNS형 게시판 만들기 프로젝트 (3) - CSS 설정
[Web] SNS형 게시판 만들기 프로젝트 (3) - CSS 설정
2020.04.13지난 시간에는 큰 틀을 잡았습니다. 이번에는 단순 table로만 설정한 틀을 고치기위해서 CSS를 잡아줍시다. 테이블로 잡으면 코드를 보기가 너무 안좋습니다. 이번에는 section, aside 등을 활용하고 CSS로 디자인을 잡아줍시다. 오늘 핵심이 되는 것은 CSS의 활용과 페이지의 구획분활입니다. HTML5에는 마치 table과 div으로 나눠놓은 것처럼 구획이 나눠져 있습니다. 보통 아래와 같이 구분을 하게 됩니다. header는 웹에서 가장 맨 위부분을 차지하게 됩니다. 보통 웹의 정보를 담고 있는 부분입니다. nav는 navigation에서 파생된 것으로 특정 목적지로 이동할 수 있게 링크들을 모아둔 영역입니다. 보통 해당 웹페이지의 카테고리 영역이 위치하게 됩니다. section은 핵심적인 ..
[Web] SNS형 게시판 만들기 프로젝트 (2) - 기본 레이아웃
[Web] SNS형 게시판 만들기 프로젝트 (2) - 기본 레이아웃
2020.04.10전체적인 디자인을 구상했습니다. 2차 과제는 기본 게시판과 글 작성 페이지를 구현하는 것입니다. 기본적인 레이아웃을 잡으라는 과제이므로 table을 활용해서 기본 레이아웃을 잡읍시다. 저번에 작성한 스토리보드를 기반으로 만들어봅시다. CSS 활용은 우선 최소한으로 해보겠습니다. 대신 코드가 굉장히 더러워집니다;; 메인 게시판으로 이동하는 이미지 링크를 먼저 구현합니다. 제가 자주 쓰는 저작권 문제없는 이미지를 받는 사이트가 있습니다. https://icon-icons.com/ko/ 무료 아이콘 SVG, PNG, ICO 또는 ICNS icon-icons.com 여기서 적당한 집 아이콘을 다운로드하여서 사용해주겠습니다. 왼쪽 위 구석에 홈 이미지를 박아둘거기때문에 따로 위치 조정은 안 합니다. html로 코..
[Web] SNS형 게시판 만들기 프로젝트 (1) - 스토리보드 구성
[Web] SNS형 게시판 만들기 프로젝트 (1) - 스토리보드 구성
2020.04.09이번 학기에 웹 프로그래밍 강의를 듣습니다. 예전에 고등학교 시절에 웹 프로그래밍을 간단히 해본 기억이 있어서 부담감은 좀 적긴 한데요. HTML5, CSS3, JSP를 이번 수업에서 배우게 됩니다. 웹 프로그래밍 수업 최종 프로젝트가 수업을 하면서 진행을 하게 됩니다. 이번 주제는 'SNS형 게시판 만들기'입니다. 공부한 걸 복습할 겸 제 프로젝트 기록을 작성해 봅시다. 저희 학교는 웹 프로그래밍을 할 때 Java Server인 JSP를 쓰기로 했기 때문에 eclipse를 활용합니다. 사실 코딩의 전반적인 걸 이클립스로 해야 하지만 이클립스는 너무 버그도 많고 구리기 때문에.... 저는 서버가 필요한 상황 아니면 아톰(Atom) 에디터를 활용하겠습니다. 제가 사용하는 아톰 플러그인이 궁금하시면 제가 작..
[Web] 아톰(Atom) 에디터 사용 플러그인
[Web] 아톰(Atom) 에디터 사용 플러그인
2020.04.08사실 설치는 이전에 해놨는 데 이번 학기부터 본격적으로 잘 사용하는 아톰(Atom) 에디터입니다. 보통 웹페이지 개발과 깃허브 자료 관리용으로 많이 쓰고 있습니다. 제가 아톰에서 사용하고 편리하다고 느끼는 플러그인과 패키지를 소개해드리겠습니다. 테마 관련 사항입니다. 패키지나 플러그인이라기보단 좀 더 아톰을 예쁘게 해주는 것입니다. 사실 예쁜 것보단 작업 파일 구분이 확실하다는 장점이 돋보이는 것 같습니다. 1. seti-ui (UI Theme) seti-ui는 확장자명에 따라서 파일 아이콘을 보여줍니다. 예를 들면 아래처럼 볼 수 있습니다. 2. atom-material-syntax-dark (Syntax type) seti-ui가 전체적인 인터페이스 디자인이라면 atom-material-syntax-..
[GitHub] GitHub로 나만의 저장소 관리하기 (3) - 깃허브 파일 다운로드, 업로드
[GitHub] GitHub로 나만의 저장소 관리하기 (3) - 깃허브 파일 다운로드, 업로드
2020.03.16$ 개발환경은 맥 OS Catalina임을 알려드립니다 $ 지난 시간까지해서 이제 로컬 저장소인 Git과 원격 저장소인 Git Hub와 연결을 했습니다. 그러면 이제 깃허브로 업로드를 하거나, 다운로드해서 작업을 진행 해봐야겠죠? 지난 시간에 이어서 깃허브의 리포지토리랑 깃을 연결해줍시다. 저는 저번시간 이후 시간이 좀 흘러서 새롭게 진행을 했습니다. 여러분은 진행하고 계시던 폴더로 사용해주셔도 괜찮습니다. 적당한 test 파일작성하고 저장해줍시다. 그리고 스테이징 후 커밋을 진행해줍시다. 깃 연결이 진행된 이후 아래와 같이 명령어를 입력해줍시다. $ git push -u origin master 이렇게 입력을 하면 위의 사진처럼 진행창이 뜨면서 업로드가 진행이 됩니다. ..
[GitHub] GitHub로 나만의 저장소 관리하기 (2) - 깃허브 연동
[GitHub] GitHub로 나만의 저장소 관리하기 (2) - 깃허브 연동
2020.03.11$ 개발환경은 맥 OS Catalina임을 알려드립니다 $ 이제 깃허브 계정도 만들었겠다 하나하나 깃허브를 꾸며나가 봐야겠죠? 매번 깃허브에 들어가서 파일을 업로드하셔도 괜찮지만 여러모로 귀찮기도 하고.... 로컬 저장소에 저장을 하고 진행하는 것도 좋습니다. 요즘은 개발과 관련된 것은 기본적으로 깃허브를 연결시켜주는 시스템이 많기는 합니다. 그래도 우리는 혹시 모르니 배워봐야죠? 가장 우선적으로 로컬 저장소와 원격 저장소를 연결해봅시다. 기본적으로 2가지를 설정합니다. 1. 컴퓨터에 로컬 깃 만들기 2. 깃허브에 연동할 리포지토리를 만든다. test1.txt를 만들어서 아무 글자나 적고 커밋을 진행해줍시다. git log를 통해서 커밋이 진행된 것을 확인했습니다. 이제 깃허브에 리포지토리를 만들어봅시다..
[GitHub] GitHub로 나만의 저장소 관리하기 (1) - 깃허브 가입 및 설정
[GitHub] GitHub로 나만의 저장소 관리하기 (1) - 깃허브 가입 및 설정
2020.03.10$ 개발환경은 Mac OS Catalina임을 알려드립니다 $ 깃으로 컴퓨터 로컬 저장소를 만들었다면 이제 원격 저장소에 저장을 해야 합니다. 열심히 만들어 놓은 자료가 로컬 저장소인 컴퓨터에만 있다가 문제로 컴퓨터가 통째로 날아간다면 그야말로 최악이죠. 이를 위해서 원격 저장소인 깃허브에 자료를 저장해주면 됩니다. 이제 깃허브 가입부터 기본 설정에 대해서 알아봅시다. github 홈페이지에 접속해줍니다. https://github.com Build software better, together GitHub is where people build software. More than 40 million people use GitHub to discover, fork, and contribute to ove..
[Git] Git으로 나만의 저장환경 만들기 (4) - 브랜치 병합 및 관리
[Git] Git으로 나만의 저장환경 만들기 (4) - 브랜치 병합 및 관리
2020.03.08$ 개발 환경은 맥 OS Catalina임을 알려드립니다 $ 지난 시간에 깃에서 브랜치를 만들고 기본적으로 관리하는 방법을 알아봤습니다. 이번에는 만들어진 브랜치를 병합하는 과정을 알아볼 예정입니다. 기껏 갈라놓은 브랜치를 왜 다시 합치는 걸까요? 어떤 작업을 진행하던 도중 필요한 경우에는 이곳저곳에 흩어진 데이터를 한 곳에 모아서 정리를 할 필요가 있습니다. 이걸 위해서 브랜치를 병합하는 것이지요. 지난 번에 만든 깃으로 이동해서 시작해봅시다. 지난 시간에 이어서 애플에서 아이폰 설명서만이 아닌 아이패드 설명서도 만들어 달라고 부탁이 들어왔다고 생각해봅시다. 그래서 애플 브랜치에서 아이폰과 아이패드 브랜치를 만들어서 작업을 해봅시다. 브랜치 명령어로 아이폰과 아이패드 브랜치 만들어 주시고 우선 아이폰 ..