IT Dev Log

Angular app - styling for main heading and Questions ( part 2 ) 이번 포스팅에서는 메인 헤더와 퀴즈 부분에 대해서 작성해 본다. 메인 헤더 작성 myQuiz 클래스에 h1 요소에 대해서 다음과 같이 설정한다. 이번에는 헤더 뒷부분에 있는 "SATURN" 을 강조하기 위한 css 를 작성해 보자. "SATURN"의 경우는 html 소스를 보면 h1 태그 밑에 span 으로 지정되어 있으므로, 이를 이용하면 이부분만 CSS를 별도로 지정할수 있다. 이렇게 작성된 CSS 를 적용하면, 다음과 같이 변경된다. 다음으로 퀴즈에 대한 질문과 예제에 대해서 알아보자. 퀴즈 질문과 보기에 대해서는 question 컨테이너를 이용하여 html을 작성하고 관리한다. 그리고..

Angular 를 이용해서 퀴즈 앱을 만들어 보려고 한다. 1. 기본 파일 생성하기 ( index.html & quiz.css ) 새로운 프로젝트를 위해서 폴더를 만들어 주고 index.html 파일을 만들어준다. 위에서 필요한 css 파일도 css/quiz.css 를 만들어준다. 여기까지 하고 브라우져를 이용해서 index.html 을 확인해 보면 다음과 같은 결과를 볼수 있다. 2. 추가 container 생성 index.html 내에 추가 container 를 만들어준다. 이제 intro container 에 환경 문구를 추가한다. 새로 추가한 container 로 작성된 내용을 브라우저에서 확인 가능하다. 3. Intro container 에 대한 CSS 작성 이제 변경된 css를 적용해보자. 4..

Django - Product 모델을 위한 view 와 templates 만들기 이번 포스팅에서는 Product 모델에 관련된 view 와 templates 를 만들어 보겠습니다. 개별 product 요청에 대한 view 를 생성한다. shop 폴더에 있는 views.py 에 다음 내용을 추가한다. product에 대한 templates 파일 만들다. Product 접근을 위한 url 설정 Product model 에 get_url () 함수를 구현한다.

Django - Category 모델을 위한 view 와 template 만들기 이전 포스트에서 Category 와 Product 에 대한 모델을 만들어봤습니다. 이번 포스트에서는 생성된 category 연동을 위한 view 와 이를 화면에 보여주기 위한 HTML template 을 만들어 보겠습니다. 이른 위한 준비과정으로 shop app 폴더 아래에 templetes > shop 폴더를 생성해 준다. 위에서 생성한 templates 폴더를 프로젝트 settings.py 에 등록해준다. 이제 부터 html template 파일을 작성해 보자. 실제 코드를 작성하기 전에 django 에서 다음과 같은 tags 를 정의 하고 있다. 이 tags 들은 html 내에서 데이터를 컨트롤하거나 프로그램을 위한 용..

이번 포스팅에서는 Django 의 queryset 에 대해서 정리할 예정이다. queryset 이란 데이타베이스에서 쿼리과 같은 것이라 생각하면된다. 장고에서 제공하고 있는 shell 을 이용해서 데이타베이스의 내용을 접근하고 변경할 수 있는 것이다. shell을 이용하기 위해서는 다음 명령어를 실행한다. 이제 models 을 내용을 shell 을 통해서 접근해 보자. 이제 특정 item 을 선택(id, pk) 해서 접근할수 있다. 다음은 filter 메소드는 이용해서 특정 아이템에 접근. 특정 단어가 포함되어 있는 Product 검색 Price 조건에 맞는 Product 검색, range 는 between 의 의미로 사용된다. 실전에서 많이 사용되고 있는 방법으로, queryset 을 통해서 직접 데이..

Wordpress Quiz 플러그인 테스트 Watu Quiz - Quiz / Question 에 대한 다양한 옵션 제공 - 프로 버젼 - 모바일뷰 형식의 문제 형식 -

Wordpress Quiz 플러그인 테스트 HD Quiz 플러그인 - 문제에 대한 생성/관리는 잘되어 있는 편 - 그림문제 / 그림 보기 등도 기능 제공 - 실제로 퀴즈를 만들어 보니, 화면도 깨지고 보기도 안보임.

Wordpress Quiz 플러그인 테스트 Quiz Cat - 간단한 인터페이스 제공 - 프리미엄 서비스 제공 ( social shares / Email / Analytics / .. ) - 모바일 뷰로 제공. - 보기에도 이미지 삽입 가능 (프리미엄) ** 퀴즈의 기본 기능에 집중된 플러그..

Wordpress Quiz 플러그인 테스트 Quiz Maker 설치하고 나면 다음과 같은 메뉴가 추가된다. 퀴즈가 모바일 뷰사이즈에 맞게 생성됨. 큰 화면에서 보면 작은 느낌. 문제와 예제에 그림 적용 가능 기본적이 5가지 문제의 타입만 제공함. 무료/유료 버전으로 제공 최종 결과는 성적과 함께 모든 문제에 대한 리뷰 제공. 모바일 뷰의 단순한 퀴즈에 적합해 보임.

Wordpress Quiz 플러그인 테스트 WordPress has been successfully installed at : http://quiz-qsm.certi.cloud Administrative URL : http://quiz-qsm.certi.cloud/wp-admin/ Log In ‹ Quiz Plugin Test — WordPress quiz-qsm.certi.cloud 첫번째 플러그인, QZM 관련 사이트 : https://wordpress.org/plugins/quiz-master-next/#installation Quiz And Survey Master – Best Quiz Plugin for WordPress Native quiz and surveys for your WordPres..