본문 바로가기

All

(220)
20210218_JavaScript09 async, await API, 강의완강 JavaScript08 JavaScript에 대해 공부하기 위해서 유튜브 '드림코딩by엘리' JavaScript 강의를 듣고 글을 쓰고 있다.(강의가 엄청 잘되 있으니 강의를 찾아보자!) 드림코딩by엘리 - JavaScript JavaScript async, await API 동기 vs 비동기 동기 사용시 백엔드에서 가져올때 시간이 걸리고 기다려야해서 다음 코드를 진행 못해 사용자는 버벅거림(중간 로딩)을 볼 수 밖에 없음 비동기를 사용해서 요청만 해놓고 기다리지 않고 다른 코드를 진행시켜 완료후에 요청한 결과를 전달함 // 동기 사용 // raccon 표시까지 10초 function fetchUser() { // do network request in 10 sec... return &#3..
20210217_JavaScript08, async, Callback function, Promise Object JavaScript08 JavaScript에 대해 공부하기 위해서 유튜브 '드림코딩by엘리' JavaScript 강의를 듣고 글을 쓰고 있다.(강의가 엄청 잘되 있으니 강의를 찾아보자!) 드림코딩by엘리 - JavaScript JavaScript Callback 비동기 처리의 시작 콜백 이해하기 동기(sync)와 비동기(async) Synchronous(동기) : 코드 블럭이 쓰여진 순으로 즉시실행하는 것 javaScript는 동기적인데, 호이스팅 이후에 코드블럭을 순서대로 실행한다. (JavaScript is synchronous., Execute the code block in oder after hoisting.) hoisting(호이스팅): var, function declarati..
20210216_JavaScript07 Array_quiz확인, String methods, Array methods, JOSN개념(HTTP, AJAX, XMLHttpRequest, JSON, XML) JavaScript07 JavaScript에 대해 공부하기 위해서 유튜브 '드림코딩by엘리' JavaScript 강의를 듣고 글을 쓰고 있다.(강의가 엄청 잘되 있으니 강의를 찾아보자!) 드림코딩by엘리 - JavaScript 드림코딩 Array_quiz (강의 듣고서 확인) 일단, 강의 들으면서 놓친 Array API 위치를 확인함 가독성 좋게 메소드를 연달아 쓸수 있는 법을 확인함(리얼 꿀팁) 'use strict'; // Q1. make a string out of an array console.log(' Q1. make a string out of an array') { const fruits = ['apple', 'banana&#3..
20210215_JavaScript06 ES Array API(methods), String methods, 드림코딩Array_quiz JavaScript06 JavaScript에 대해 공부하기 위해서 유튜브 '드림코딩by엘리' JavaScript 강의를 듣고 글을 쓰고 있다.(강의를 꼭보길 바란다 너무 잘되어 있다.) 드림코딩by엘리 - JavaScript ES Symbol String method (수정 21/02/16 해당 string method는 symbol인 경우의 method였다.오해 하지 말길! string method 는 다음 글에서 다시 알아볼 예정) interface String { /** * Matches a string or an object that supports being matched against, and returns an array * containing the results of tha..
20210213_JavaScript05 ,Object, Array JavaScript05 JavaScript에 대해 공부하기 위해서 유튜브 '드림코딩by엘리' JavaScript 강의를 듣고 글을 쓰고 있다.(강의를 꼭보길 바란다 너무 잘되어 있다.) 드림코딩by엘리 - JavaScript Object (dict in python) one of the JavaScript's data types. a collection of related data and/or functionality Nearly all objects in JavaScript are instances of Object 오브젝트가 없으면 일일이 변수들을 선언해 주어야 하고 코드의 중복이 많아짐 정리가 어려워 찾기가 어려움 (접근하기도 불편해짐) 즉, 자료의 검색, 정렬, 삭제, 추가가..
20210212_JavaScript04 Class, Object, inheritance(상속), static(methods, proerties) JavaScript04 JavaScript에 대해 공부하기 위해서 유튜브 '드림코딩by엘리' JavaScript 강의를 듣고 글을 쓰고 있다.(강의를 꼭보길 바란다 너무 잘되어 있다.) 드림코딩by엘리 - JavaScript Class vs Object Class는 연관된 데이터를 묶어 정리하는 container 역할 Class는 fields와 methods가 종합적으로 묶여 있음 data class : data인 fields만 들어 있는 Class incapsulation : class 안에서 내부적으로 보여지는 변수, 밖에서 보일수 있는 변수로 나누는 것 inheritance 객체로 잘 정의해서 만들수 있어야 한다. // person 이라는 클래스 class person{ name; /..
20210210_JavaScript03 function, 함수선언, 매개변수, 지역전역 변수, 함수표현식, Arrow JavaScript03 JavaScript에 대해 공부하기 위해서 유튜브 '드림코딩by엘리' JavaScript 강의를 듣고 글을 쓰고 있다.(강의를 꼭보길 바란다 너무 잘되어 있다.) 드림코딩by엘리 - JavaScript JavaScript functions 각각 프로그램들은 고유한 기능들이 있고 그 프로그램 안에서도 각각의 기능들을 수행하는 function들이 존재함. JavaScript도 java처럼 pure한 Object 언어가 아님 (프로토타입 베이스의 가짜 object 언어) function 을 sub-program이라고 하기도 함! input을 받아서 output으로 return 하는 것이 function임 언어내 내장 함수 또는 API(Application Programmi..
20210209_JavaScript02 operator(연산자), 문자, 숫자, 논리, 증감, 비교, 조건, 반복 JavaScript02 JavaScript에 대해 공부하기 위해서 유튜브 '드림코딩by엘리' JavaScript 강의를 듣고 글을 쓰고 있다. (강의를 꼭보길 바란다 너무 잘되어 있다.) 드림코딩by엘리 - JavaScript JavaScript 지난시간 variable vs object primitive variable은 값 자체가 메모리에 할당됨 object 는 const를 통해 오브젝트를 할당하면 실제로는 reference를 먼저 가르켜 메모리에 reference가 할당되고 reference가 다른 값들을 가르킴 JavaScript operator 1. String concatenation (문자 연쇄) str + str = strstr 신기한 것 string num('12&#..
20210208_JavaScript01 JS의 역사와 미래, ES이해, JS문법, 자료구조 JavaScript01 JavaScript에 대해 공부하기 위해서 유튜브 '드림코딩by엘리' JavaScript 강의를 들었다.(강의를 꼭보길 바란다 너무 잘되어 있다.) 드림코딩by엘리 - JavaScript 물론, documents 를 보는 것도 좋지만 먼저 강의를 보고 documents를 보려고 한다. 정말 강의를 풀어내는 방식이 깔끔하고 의문점 갖게 해주고 잘 설명해 주신다~ 생활코딩님 처럼 너무 잘하신다~ JavaScript의 역사와 미래 Netscapte 회사 Mosaic web Browser(Marc Andreessen) -> Netscape사의 Netscape Navigator 브라우저(1994) "정적인 웹사이트" -> "동적인 웹사이트"에 대한 갈망 Script 언어 추가..
20210206_Django 태그 기능, get_or_create, ManyToManyField, 배포(pythonanywhere) Django 게시판 기능 보완 글 목록에서 제목 눌러서 글 보기 창 들어가기 (연결) table요소의 열 태그인 tr태그에 onclick으로 연결해 주었고 추가적으로 포인터가 있으면 좋을 것 같아서 role="button"을 통해서 마우스를 올리면 손가락 표시가 나타나게 하였다. {% raw %} {% extends "base.html" %} {% block contents %} # 제목 아이디 일시 {% for board in boards %} {{ board.id }} {{ board.title }} {{ board.writer }} {{ board.registered_dttm }} {% endfor %} {% if boards.has_previous %} 이전으로 {% else %} 이전으로 {% ..
20210205_Django 예외 처리, 기능보완, request.get, request.GET, 페이징(paginator, page) Django 게시판 게시판 예외처리 예외 처리 함수 try : 에러나 날수도 있는 함수 부분 except : 에러가 나는 경우 실행 코드 except 모델.에러명:을 통해서 특정 에러에 대해 조건을 줄수 있다. 에러명은 django에서 사이트 돌릴때 해당 사이트의 에러창을 참고 함수 탈출 및 실행 명령문 break , continue : 반복문에서 탈출이나 실행 return : 함수에서 탈출 pass : 함수 및 반복문 모두 실행 예외 상황 존재하지 않는 아이디로 로그인 하는 경우 없는 글의 pk로 글 자세히 보기를 하는 경우 로그인 없이 글을 쓰는 경우 페이징 기능 게시글이 어느 정도 이상 생기는 경우 페이지를 생성해서 넘길수 있게 하는 기능 html 만들기 목록 하단에 네비게이터를 이용하여 페이징 버..
20210204_ Django 게시판 리스트 화면, 글쓰기 화면, 글 보기 화면 만들기, template language, form Django 게시판 만들기 게시판 리스트 화면 만들기 기본 html 화면 구성만들고 연결 base.html 가져오기 base.html {% raw %} {% block contents %} {% endblock %} {% endraw %} board_list.html 테이블 요소의 태그 테이블 요소 설명 사이트 : 테이블 태그 : 행 태그 (보통 모두 행 태그로 묶음) : 헤더 셀 태그 : 셀 태그 기본적인 틀만 만들어 둔 상태 {% raw %} {% extends "base.html" %} {% block contents %} # 제목 아이디 일시 1 테스트 제목 테스트 아이디 2021-02-04 21:11:00 글쓰기 {% endblock %} {% endraw %} 테스트를 위한 간단한 views ..
20210203_ Django 로그인,세션처리, render, redirect, is_valid, clean(), form 활용 Django 로그인 redirect 처리 확인해 보면 (개발자 툴 - Application - cookies) 브라우저가 다르면는 session을 다르게 인식하기 때문에 시크릿 모드 브라우저와 그냥 브라우저와 session id와 토큰이 다르다 각 세션 아이디 별로 세션 공간이 따로 존재하는데 이것을 쿠키임-> 자동으로 세션 관리해줌으로 그냥 쓰면 됨 세션 값들이 클라이언트를 식별하게 해주는 식별자가 됨 render vs redirect render : render(request, template_name, context=None, content_type=None, status=None, using=None) context 값을 넘길 수 있음, 템플릿을 불러옴 redirect : redirect(to, ..
20210202_ Django admin, template,view만들기, url연결 - 회원가입, 로그인 Django Django admin 기본적으로 admin의 경우 settings.py를 통해 활성화 되어 있다. 또한 urls.py의 경우에도 admin은 기본적으로 만들어져 있다. url주소에 admin을 붙이면 관리자 창을 이용할 수 있다. python manage.py runserver를 통해서 서버를 돌리고 해당 ip주소로 들어가면 홈페이지가 뜬다. 해당 ip주소에 /admin을 넣으면 관리자 로그인 화면이 뜬다. 서버 종료는 ctrl + c 로그인을 위해서 계정을 만들어야 하는데 python manage.py createsuperuser 를 통해 만들수 있다. 이를 통해서 로그인 하면 개발자 툴 페이지로 접근 가능하다. Django admin 활용 앱에서 만든 모델 어드민에 등록 admin.py..
20210129_ Django 가상환경 설정, MVC, MVT Django 1. 가상환경 설정 한 pc에서 여러 프로젝트 사용시, 각 프로젝트에 같은 패키지를 사용하는데 버전이 다른 것을 사용한다고 할때 계속해서 프로젝트 이동시 패키지를 재설치 해줘야 하는 문제가 생김 -> 프로젝트 별로 패키지를 관리하는 공간이 분리될 필요가 있음 가상환경을 제공하는 패키지 중 하나 : virtualenv 가상환경을 구축하고 싶은 폴더에서 터미널에 pip install virtualenv로 패키지 설치 virtualenv 가상환경 이름 터미널에 입력하여 가상환경 생성 cd Scripts -> activate 해서 가상환경 활성화 시킴 pip install django를 통해서 장고 설치 vscode내 터미널에서 가상환경 활성화 문제 해결 사이트 ctrl + shift + p에서 >..
20210128_인터넷 동작 ,웹 관련 용어, URL, 도메인 네임, HTTP, Hyperlink, Django환경설정 웹 서버 구축을 위한 DJango 프레임 워크를 배우기 전에 사전적인 지식이 필요할듯 했다. 그냥 듣기에는 너무나도 사전지식을 이야기 해주지 않았기에 능동적으로 인터넷의 동작 원리와 발전 그리고 웹에대한 내용들 까지 Mozilla 공식 문서를 참고하여 공부해 보았다. Mozilaa_How does the Internet work? 참고로 한글 지원도 한다. 우측 상단에 langauge change를 지원한다. 인터넷 동작 원리 컴퓨터와 컴퓨터를 연결하면 컴퓨터가 많아지면 수많은 선들이 많이 생겨 복잡해짐 -> 라우터를 중심으로 컴퓨터를 연결 더욱 확장시켜 라우터와 라우터를 연결하여 커짐 -> 하지만 그들만의 인터넷이지 먼 거리와 연결하기 힘듦 그래서 전화선은 보급이 많이 되어 있기 전화선을 활용하는데 전..