728x90 반응형 분류 전체보기362 Django Rest Framework _ @api_view 사용하기 얼마 전 맛을 본 DRF. 그런데 뭐가 뭔지 전혀 모르겠었다! 정말 맛의 맛의 맛만 본 느낌. 오늘은 처음부터 차근차근 만들어 볼 예정. 1. 기본 환경 세팅 저번에 했던 거랑 똑같다! Project와 App을 생성하고, pip install로 djagnorestframework도 설치! settings에 적어주는 걸 빼먹으면 안 된다! 이제는 말하면 입 아프다! 2. model 생성 models.py 뭐 정말 흔한 model이다. 3. Serializer 작성 저번에는 앱 자체를 Api라고 이름 붙였었다. 하지만 모든 앱을 그렇게 처리할 수는 없는 노릇. 따라서 기존 앱(여기서는 BlogApp)에 api라는 폴더를 만들고, 그 안에 serializers.py를 만들어준다! serializers.py 역.. 2021. 1. 21. React Component, props, state 맛보기 react를 사용한 애플리케이션은 다양한 컴포넌트로 구성되어 있다. 요놈들은 단순한 템플릿 기능을 넘어, 데이터가 주어졌을 때 이에 맞춘 UI를 만들어주는 등 다양한 기능들을 붙일 수 있는 것! 1. Component 제일 먼저 컴포넌트를 만들 MyComponent.js 파일을 만들어주자. 컴포넌트를 생성할 때는 뒤에 extends Component를 붙여줘야! 항상 붙어있었던 export 요놈은 다른 파일에서 얘를 import 할 때 사용될 요소를 선언한 것. App.js의 return에 방금 만든 를 적어주면... 와우! 2. props props는 컴포넌트의 속성을 설정할 때 사용하는 요소. props값은 해당 컴포넌트를 불러와 사용하는(부모 컨포넌트, 여기서는 App.js) 곳에서만 설정이 가능하.. 2021. 1. 20. React 맛보기 백엔드로 django REST API를 사용했으니 이를 프론트, 즉 react와 연동해보자! 현재 django REST API로 Post라는 모델을 만들고, CRUD까지 구현한 상태. 1. React 세팅 간단하게 react app을 생성할 수 있는 create react app을 사용하고자 한다. 이를 위해 우선 create react app을 설치! npm install create-react-app 으로 설치해주자. 흠... 안 된 것 같기도 하고, 잘 된 것 같기도 하고. 다음은 설치한 create-react-app을 이용해 react app을 설치! blogapp이라는 앱을 만들어줬다. 그럼 django-admin startapp과는 달리... 뭔가가 어마무시하게 이뤄진다. 당황하지 않고 쭉 기.. 2021. 1. 19. Django REST Framework 맛보기 PNU Quiz앱을 만들기 위해 다른 개발자가 만든 퀴즈를 참고했었다. git clone을 받아 runserver를 돌려보니... 분명 완성된 코드인데, 이상한 화면밖에 보이지 않았다. 이게 무슨 일? 답답함을 해결하기 위해... 우리고 django REST framework의 맛을 봐보자. 당시 뭣도 모르고 쓴 글! 올바른 이해를 위해서는 이 다음 글부터 보는 게 훨씬 나을 듯싶다. medium.com/wasd/restful-api-in-django-16fc3fb1a238 RESTful API in Django Django REST framework를 이용해 RESTful API를 개발해봅시다. medium.com 블로그 참조! 감사합니다. 맛을 보기 위해 일단 설치! pip install로 djang.. 2021. 1. 19. JavaScript with jQuery js를 통해 열심히 페이지를 작성했는데... 브라우저마다 보이는 화면이 다르면 몹시 슬플 테다. '모든 웹 브라우저에서 정상적으로 작동하게 만드는' 것은 중요하면서도 꽤나 어려운 일. 이 때문에 다른 사람이 만든 라이브러리를 사용하곤 하는데, 이것이 바로 jQuery! 제일 먼저 html과 우리의 js를 연결. 그런데 jQuery는 다른 사람이 만들어 둔 라이브러리라고 했다. 따라서 요놈도 script로 받아와야 한다! 그럼 누가 만든 라이브러리를 받는디? 구글에 쳐보면 많다! 여기서는 made in 구글을 이용. 희한하게 생긴 $ 가 붙어있다. 요놈은 jQuery 라이브러리의 함수! 기본적으로 $().메소드(, ) 의 형태로 사용된다. jQuery에서 객체를 생성하기 위해서는? document, css.. 2021. 1. 18. PNU Quiz App _ django로 퀴즈 구현하기 부산대학교 학생들을 위한 간단한 퀴즈 페이지를 구현해보기로 했다. 이를 위해 어떤 기능들이 필요할까? 1. 데이터베이스에 입력해둔 질문과 보기, 답을 하나씩 띄워준다. 2. 각 보기 중 정답을 클릭했을 때, 유저의 점수가 하나씩 올라간다. 3. 점수 범위에 따라 각기 다른 결과 페이지가 나온다. 흐음... 이렇게 적으니 어떻게 구현해야 할지 당최 감도 안 온다. 물론 수많은 개발자들이 퀴즈 기능을 구현할 수 있는 코드를 작성해뒀다. 대한민국 개발자 만세! 당연히 django를 이용한 것도 있다. 하지만 대부분이 프론트는 react, 백앤드는 django rest framework를 이용한 상태. 코드를 봐도 무슨 소리인지 깜깜... youtu.be/q7MUD_3dJNc 그런데 오직 django를 이용해 .. 2021. 1. 15. JavaScript in WebEvent js에서는 페이지에서 일어나는 여러 이벤트들을 지정할 수 있다. 대충 적어봐도... 마우스, 키보드, 사용자 인터페이스, 터치, 구조 변화 등! 생동감 있는 페이지를 위해선 어느 하나 빼놓을 수 없다. 역시나 js파일은 외부참조! webevent.js라는 파일을 만들었다. html상에 버튼을 하나 만들어줬다. onclick속성을 통해... 클릭하면 buttonClick이라는 함수가 작동된다. 요놈은 어디에? 아항! js 파일에서 이렇게 buttonClick 함수를 만들어줬다. 작동하면 클릭 이라는 경고창을 띄운다. 잘 뜨는구만. 이렇게 id를 지정해 불러올 수도 있다! id를 통해 객체를 지정할 테니 getElementById를 사용했다! 요 button은 onclick이벤트를 가지는데... 이 녀석을 .. 2021. 1. 13. JavaScript in Web js의 꽃! 페이지 동작의 핵심! web에서 js를 이용해 여러 기능들을 구현해보자. inweb.html html상에 js 코드를 입력해도 되지만... 길어진 코드가 보기 좋을 리 없다. 따라서 (CSS 연결처럼) head태그 안에 다음과 같이 적어줘 외부 js 파일과 연결시키자. 1. window 객체 제일 먼저 window 객체! prompt는 입력 받을 수 있는 프롬프트를, alert는 경고창을 출력한다. 2. location 객체 setInterval 은 지정한 시간(여기서는 3초) 이후 함수를 작동시킨다. ↑이는 setTimeout 함수에 대한 설명! setInterval은 지정한 시간 간격마다 반복해서 함수를 실행한다! location은 html의 href와 유사한 기능! 뒤에 href, as.. 2021. 1. 13. JavaScript 기초 행요를 개발했을 때, 카카오맵 API를 받아와서 사용했다. 처음 해당 코드를 본 순간... 느껴졌던 당혹감. 난생처음 만난 JavaScript. 뭐가 뭔지 도무지 알 수가 없었다. 덕분에 지도와 관련된 부분은 일절 다룰 수가 없었다. 속상. 그런고로... JavaScript를 정말 기초부터 시작할 예정. 참고 교재 : 자바스크립트 프로그래밍 입문 , 윤인성 저 1. 파일 생성 및 실행 JavaScript파일을 만들기 위해 js 확장자를 달아준다. 실행을 위해 python처럼 node + 파일명! 2. 연산자 파이썬의 print와 유사한 개념(인 듯 싶은...?) → console.log! 비교 연산자는? >, 30>20 ← 이렇게 적어버리면 False가 나온다..! 왜냐? 왼쪽부터 계산하므로 40>30 .. 2021. 1. 13. 이전 1 ··· 33 34 35 36 37 38 39 ··· 41 다음 728x90 반응형
