본문 바로가기

분류 전체보기124

[React] CRUD 블로그 만들기 - 2. 프론트엔드 [React] CRUD 블로그 만들기 - 1. 백엔드 에 이은 포스팅입니다. [React] CRUD 블로그 만들기 - 1. 백엔드 프로젝트 목적: React 프로젝트로 CRUD 게시판 만들기. 챕터 1. 백엔드 개발. 웹 서버 - Koa 프레임워크를 사용했다. Django와의 고민이 있었지만, python을 추가로 설치할 필요 없이 nodejs로 개발할 수 있다는.. bolob.tistory.com 프로젝트 목적 React 프로젝트로 CRUD 게시판 만들기 프론트엔드 개발 구현 기능 및 화면 회원가입/로그인, 포스트 목록 조회, 특정 포스트 조회, 포스트 작성/수정/삭제 상태 관리 모듈, 컴포넌트를 react-router-dom와 Redux로 상태 관리 해결한 오류 Fix typo(오타, 필드 네임 불일.. 2020. 3. 9.
[Chrome] 크롬 단축키 정리 탭 및 창 단축키 작업 단축키 새 창 열기 Ctrl + n 시크릿 모드로 새 창 열기 Ctrl + Shift + n 새 탭을 열어 이동 Ctrl + t 이전에 닫은 탭을 닫은 순서대로 다시 열기 Ctrl + Shift + t 다음에 연 탭으로 이동 Ctrl + Tab 또는 Ctrl + PgDn 이전에 연 탭으로 이동 Ctrl + Shift + Tab 또는 Ctrl + PgUp 특정 탭으로 이동 Ctrl + 1~Ctrl + 8 맨 오른쪽 탭으로 이동 Ctrl + 9 현재 탭에서 홈페이지 열기 Alt + Home 현재 탭의 인터넷 사용 기록에 저장된 이전 페이지 열기 Alt + 왼쪽 화살표 현재 탭의 인터넷 사용 기록에 저장된 다음 페이지 열기 Alt + 오른쪽 화살표 현재 탭 닫기 Ctrl + w 또는 C.. 2020. 3. 9.
[React] CRUD 블로그 만들기 - 1. 백엔드 프로젝트 목적: React 프로젝트로 CRUD 게시판 만들기. 챕터 1. 백엔드 개발. 웹 서버 - Koa 프레임워크를 사용했다. Django와의 고민이 있었지만, python을 추가로 설치할 필요 없이 nodejs로 개발할 수 있다는 점이 큰 장점으로 작용했다. 백엔드 라우팅은 Koa-router를 사용하여 다른 주소로 요청이 들어올 때 다른 작업 처리하도록 했다. REST API를 사용하여 직접 데이터를 변경하지 않고 클라이언트와 DB 사이에 REST API(서버)를 두어 작업을 처리했다. (요청 종류에 따라 다른 HTTP 메서드 사용함. 포스트 작성: POST, 포스트 목록 조회: GET, 포스트 삭제: DELETE, 포스트 업데이트: PATCH ... ) 폴더 / 파일 관리: 폴더 - 라우팅 종류.. 2020. 3. 8.
[Github] Github 시작할 때, 필수 기능 사용법 1. Git Repository 만들기. - Github 상단 메뉴바의 New repository 클릭 > 저장소 생성 - Repository name 작성 > Create repository 버튼 선택 (gitignore: Track하지 않을 파일들 적어놓는 곳 / license: 이 소프트웨어의 라이센스가 무엇인지 정하는 곳) 2. Repository와 프로젝트 연결하기. - cmd에 입력하기: git remote add origin [Repository주소] Repository 주소 예시: https://github.com/[Owner]/[RepositoryName] 3. git 저장소 생성하고 Commit하기. - cmd에 입력하기: 1) 프로젝트 폴더 위치로 이동: cd [프로젝트경로] 2) 프.. 2020. 2. 26.
[jQuery] jQuery 요소 찾기, 텍스트 바꾸기, 요소 변경/생성 1. 텍스트 바꾸기 안녕하세요? What is jQuery? jQuery is the most popular JavaScript library. It gives developers lots of useful functions so they can make their webpage interactive across multiple browsers. jQuery is an open source library with a big community of contributors. Why should you learn jQuery? If you learn jQuery, you'll be able to use it in your own webpages, understand other developer's webpag.. 2019. 12. 22.
[Node.js] Node.js로 서버 구축하기 간단한 턴제 게임의 서버를 구축해보기 서버 실행 코드 cd [file_path] node server.js server.js const http = require('http'); const url = require('url'); const fs = require('fs'); http.createServer((request, response) => { const path = url.parse(request.url, true).pathname; // url에서 path 추출 if (request.method === 'GET') { // GET 요청이면 if (path === '/about') { // 주소가 /about이면 response.writeHead(200,{'Content-Type':'text/ht.. 2019. 12. 22.
AJAX란 Ajax(Asynchronous JavaScript and XML) 빠르게 동작하는 동적인 웹 페이지를 만들기 위한 개발 기법 중 하나. 웹 페이지 전체를 다시 로딩하지 않고도, 웹 페이지 일부분만을 갱신할 수 있게 해준다. 즉, 백그라운드 영역에서 서버와 통신하여, 그 결과를 웹 페이지의 일부분에만 표시할 수 있다. Ajax의 한계 클라이언트가 서버에 데이터를 요청하는 클라이언트 풀링 방식(사용자가 직접 원하는 정보를 서버에 요청하여 얻는 방식)을 사용하므로, 서버 푸시 방식(사용자가 요청하지 않아도 서버가 알아서 자동으로 특정 정보를 제공하는 것, 앱 푸시 알림)의 실시간 서비스는 만들 수 없음. Ajax로는 바이너리 데이터를 보내거나 받을 수 없음. Ajax 스크립트가 포함된 서버가 아닌 다른 서버.. 2019. 12. 21.
[중급] Object 클래스 Object 클래스 최상위 클래스, 아무것도 상속받지 않으면 자동으로 Object 상속. 오브젝트의 메소드 중 가장 많이 쓰는 메소드 셋. (반드시 오버라이딩) equals 객체가 가진 값 비교 toString 객체가 가진 값 문자열로 변환 hashCode 객체의 해시코드 값 반환 package com.company; import java.util.Objects; public class Student { String name; String number; int birthYear; //generate @Override public String toString() { return "Student{" + "name='" + name + '\'' + ", number='" + number + '\'' + ", .. 2019. 12. 19.
[기초] 예외 처리 예외 처리 1) try{ } catch(Exception e){ } finally{ } 2) throws Exception public class Main { public static void main(String[] args) { int i =10; int j =0; try{ int k = divide(i,j); System.out.println(k); }catch(ArithmeticException e){ System.out.println("0으로 나눌 수 없음."); }finally{ System.out.println("----끝----"); } } public static int divide(int i ,int j) throws ArithmeticException{ int k = i/j; retu.. 2019. 12. 19.
[기초] 내부 클래스, 익명 클래스 1) 중첩 클래스 / 인스턴스 클래스 (필드 선언 위치에 선언됨) 밖에 Main 객체를 만든다 -> Main.Cal cal = m.new Cal(); 생성 후 사용 public class Main { class Cal{ int val = 0; public void plus(){ val++; } } public static void main(String[] args) { Main m = new Main(); Main.Cal cal = m.new Cal(); cal.plus(); System.out.println(cal.val); } } 2) 정적 중첩 클래스 / static 클래스 (내부 클래스가 static으로 정의됨) Main 객체 생성할 필요 없이 Main.Cal cal = m.new Cal(); 생.. 2019. 12. 19.
[기초] String 클래스 문자열 인스턴스 생성 방법 2가지 1. new 연산자를 사용하지 않고 인스턴스를 만드는 경우 상수 저장 영역에 저장됨 이미 같은 문자열 상수가 만들어져 있다면 그 인스턴스를 참조한다 2. new 연산자로 인스턴스를 만드는 경우 무조건 새로운 인스턴스 생성 그래서 내용이 같더라도 서로 다른 인스턴스를 참조한다 public class Main { public static void main(String[] args) { String str1 = "hello"; //상수 저장 영역(변하지 않는 값)에 저장됨. String str2 = "hello"; //이미 문자열 상수가 만들어져 있으므로 str1 이 참조하는 인스턴스를 str2도 참조한다. String str3 = new String("hello"); //n.. 2019. 12. 19.
Java 개발 환경 Intellij 설치 아무래도 이클립스는 너무 무겁고 느리다. 게이밍 노트북을 사용하는데 소리가 위이이이이잉 나서 주변에서 한 번씩 볼 정도다. 그동안 더 익숙하다는 이유로 주로 이클립스를 사용했는데, 인텔리 제이를 사용했을 때의 빠른 준비 시간과 가벼운 파일 구성, 편리함 등을 잊을 수 없어서 당분간은 인텔리 제이를 사용해보려고 한다. 이클립스는 굳이 필요하지 않은 듯한 파일도 같이 껴있고, 이클립스가 아니면 돌아가지 않는 프로젝트가 되는 경우가 있었기 때문에, (뭐 만들 때의 이슈였는지 잊어버렸다.. 안드로이드였는지 웹이었는지) 커스텀이 비교적 자유롭고 가벼운 인텔리 제이를 선택했다. Windows 보안 설정도 해주고, 학생용으로 설치도 완료했다. 주 목적은 1) 알고리즘 공부와 2) 웹 프로젝트 만들기. IDE 처음 설.. 2019. 12. 19.

티스토리툴바