삶과 개발

0517 Client + Server 둘다 개발하기 cors 개념 익히기 cors 무엇일까? 우리 현재 배운느건클라이언트 구조 개발자는 프론트 백엔드 라고 생각한다 사용자가 보는 화면은 뷰 장고로 api 서버를 만드는 것을 백엔드 또는 서버라 부른다. 장고로는 API (백)를 사용하고 클라이언트를 자유롭게 사용하면 휴대폰, 데스크탑 등의 응용프로그램으로 만들수있다. ( 화면만 다른 언어로 만든다는 것 ) 문제 Client + Server Same Origin Policy (SOP) 브라우저 같은 출저에서 온 정보만 사용 가능! 다른 포트 == 다른 출저 CORS( Cross Origin Resource Sharing) 브라우저가 같은 출저가아니라도 가능 API Server 에서 white list 를 만..

시작하기(세팅) vue router router 를 복습하기위한 파일 생성해주기 vue 2 를 선택해서 만들어줍니다. vue create second-vue-app . ls 로 확인해보고 second-vue-app 으로 들어가기 cd second-vue-app 서버를 실행해본다 npm run serve 정상적으로 실행이 됐다면 서버를 끄자. 라우트 관련된 설정을 하자 이러한 플러그인들은 제~일 처음 다적어줘야합니다잉~ vue add router 실행해보면 현재 디렉토리에 commit이 안된 파일이있는데 그냥 진행할래? Yes 다시 서버실행 npm run serve 요롷게하면 상단에 Home|About 이라는 네비바가 뜨는데 이동해보면 새로고침이 안뜬다! router의 index.js 를 가보자 index..

Vue.js 프론트 엔드 HTML, CSS , JavaScript Vue.js, React(facebook), Angular(google) Vue.js 사용자 인터페이스를 만들기 위한 프로그레시브 프레임워크 현대적인 tool과 다양한 라비러리를 통해 SPA(Single page Aplication)를 완벽하게 지원 Evan You (2014) Angular 개발자 출신 학사 미술, 미술사 전공/ 석사 디자인 & 테크놀로지 전공 구글 Angular 보다 더 가볍고, 간편하게 사용할 수 있는 프레임워크를 만들기 위해 개발 SPA 단일 페이지 애플리케이션 현재 페이지를 동적으로 작성, 사용자와 소통하는 웹 애플리케이션 단일 페이지 구성, 처음 페이지만 받아오고 (HTML) 동적으로 DOM을 구성 새로고침 X ..

좋아요 새로고침없이하기! 가상환경만들기 python -m venv venv activate python manage.py migrate python manage.py seed articcles --number=30 python manage.py runserver 브라우저에서 like 을 누르면 json으로 django로 이동하게? articles > templates > index https://github.com/axios/axios CND 활성화 스크립터 넣어주기 https://developer.mozilla.org/ko/docs/Web/API/HTMLOrForeignElement/dataset 에서 script 에서 pk 넣는 방식? 을 확인할수있다 index.html {% extends '..

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788 Dog API img { height: 500px; } Dog API Get dog Cat API Get cat /////////////////////////////////////////////////////////////////dog const API_URI = 'https://dog.ceo/api/breeds/image/random' // 교수님 코드 // function getDog() { // axio..

종합 DJANGO code 목차 CRUD articles html accounts html 1. CRUD settings.py """ Django settings for crud project. Generated by 'django-admin startproject' using Django 3.1.7. For more information on this file, see https://docs.djangoproject.com/en/3.1/topics/settings/ For the full list of settings and their values, see https://docs.djangoproject.com/en/3.1/ref/settings/ """ from pathlib impor..

Dom 실무?

DOM DOM Tree 객체(object)는 속성과 메서드를 통해 조작 가능 DOM Manipulation selection, Manipulation 속성, 메서드 선택 -> 변경 / 생성 -> 추가 Event 브라우저(HTML 문서) 안에서 일어나는 일 click, input, mouseover, submit, change Event Handler EventTarget.addEventListener(type, listener) "특정 이벤트가 발생하면, 할 일을 등록하자" ECMAScript 변수와 식별자 타입과 연산자 조건 & 반복 함수 자료구조 Array Object

Swagger 문서를 우리가 쓰기 편하게 변환시켜줌 drf yasg https://drf-yasg.readthedocs.io/en/stable/ pip install -U drf-yasg INSTALLED_APPS = [ ... 'django.contrib.staticfiles', # required for serving swagger ui's css/js files 'drf_yasg', ... ] articles > urls.py 맨위에 from rest_framework import permissions from drf_yasg.views import get_schema_view from drf_yasg import openapi urlpatterns 위에 schema_view = get_schema..

REST API API 응용 프로그램에서 사용할 수 있도록, 운영체제나 프로그래밍 언어가 제공하는 기능 을 제어할수있게만든 것 프로그램과 다른 프로그램이 제공하는 기능이나 데이터를 사용하기 위한 수단 우체국 우편을 보내기 위해서는 '올바른 주소' API == 우체국 우편 서비스 ( 어떻게 보내는지는 알필요없다.) API 명세 API를 사용한다. Queryset 도 API 이다. HTTP Method 복습하기 자원 URL 구성 http(s)://api.example.com/articles/ RESTful API GET/articles/1/ 1번 게시글 검색 POST 생성 POST/users/1/ 1번유저가있다라는 뜻 말이 안된다. 0427 수업 시작 python -m venv venv act..