Djangoroidの奮闘記

python,django,angularJS1~三十路過ぎたプログラマーの奮闘記

2017-01-01から1ヶ月間の記事一覧

CSSとかのコツ

CSSって、ちゃんと勉強してないので、いまいち理解できてない。他の人が作ったhtmlファイルとか、cssファイルは読解が難しい気がする。 CSSの場合、classが重要なので、classをまず確認する。 そのclassが、どういう仕様になっているのか、コードの記載があ…

AngularJS1 + Django REST Frameworkに再挑戦 その12 Comment Reply Directive

概要 AngularJS1 + Django REST Frameworkに再挑戦 その12 Comment Reply Directive 参考動画 Django + AngularJS | Coding For Entrepreneurs Reply to Comments part1 js/app/comment/comment.directive.js を作成する。 'use strict'; angular.module('co…

AngularJS1 + Django REST Frameworkに再挑戦 その11 Reply to Comments

概要 AngularJS1 + Django REST Frameworkに再挑戦 その11 Reply to Comments 参考動画 Django + AngularJS | Coding For Entrepreneurs Reply to Comments コメントのreplyとかを表示したい。まずはcommentのcontextの内容を確認する。 <ul ng-show='comments.length > 0'> <li ng-repeat='comment in comments | filter: query'> {{ comment.conten</li></ul>…

AngularJS1 + Django REST Frameworkに再挑戦 その10 ngResource Create & Delete

概要 AngularJS1 + Django REST Frameworkに再挑戦 その10 ngResource Create & Delete 参考動画 Django + AngularJS | Coding For Entrepreneurs ngResource Create & Delete ngResource を使って、commentをsave, deleteする機能を実装する。 blog-detail.…

AngularJS1 + Django REST Frameworkに再挑戦 その9 Comment ngResource

概要 AngularJS1 + Django REST Frameworkに再挑戦 その9 Comment ngResource 参考動画 Django + AngularJS | Coding For Entrepreneurs Comment ngResource ngResource は、$httpを含んでおり、サーバとHTTP通信でデータのやりとりをするものなのかな。 cor…

AngularJS1 + Django REST Frameworkに再挑戦 その8 Comment ListAPI View

概要 AngularJS1 + Django REST Frameworkに再挑戦 その8 Comment ListAPI View 参考動画 Django + AngularJS | Coding For Entrepreneurs Comment ListAPI View blog-detai.component.jsのaddReplyを少し修正する。 $scope.addReply = function() { console…

AngularJS1 + Django REST Frameworkに再挑戦 その7 Comment Create API Endpoint & Serializer Context

概要 AngularJS1 + Django REST Frameworkに再挑戦 その7 Comment Create API Endpoint & Serializer Context 参考動画 Django + AngularJS | Coding For Entrepreneurs Comment Create API Endpoint & Serializer Context http://127.0.0.1:8000/api/commen…

AngularJS1 + Django REST Frameworkに再挑戦 その6 Create Comment in Backend with $http

概要 AngularJS1 + Django REST Frameworkに再挑戦 その6 Create Comment in Backend with $http 参考動画 Django + AngularJS | Coding For Entrepreneurs Create Comment in Backend with $http $httpを使って、バックエンドで、コメント作成機能を実装す…

AngularJS1 + Django REST Frameworkに再挑戦 その6 ngCookies for JWT Token

概要 AngularJS1 + Django REST Frameworkに再挑戦 その6 ngCookies for JWT Token 参考動画 Django + AngularJS | Coding For Entrepreneurs ngCookies for JWT Token 前回の続きで、今回は、JWT によって発行されたtokenを使って、angularJSからのログイン…

AngularJS1 + Django REST Frameworkに再挑戦 その5 Login with Angular & Django Rest Framework

概要 AngularJS1 + Django REST Frameworkに再挑戦 その5 Login with Angular & Django Rest Framework 参考動画 Django + AngularJS | Coding For Entrepreneurs Login with Angular & Django Rest Framework Json Web TokenというDRFの仕組みを利用して、…

AngularJS1 + Django REST Frameworkに再挑戦 その4 Backend API Serializer Updates

概要 AngularJS1 + Django REST Frameworkに再挑戦 その4 Backend API Serializer Updates Actions 参考動画 Django + AngularJS | Coding For Entrepreneurs Backend API Serializer Updates 前回は、BackendのDjango REST Frameworkからうまくslugのjsonデ…

AngularJS1 + Django REST Frameworkに再挑戦 その3 Post Objects API Integration

概要 AngularJS1 + Django REST Frameworkに再挑戦 その3 Post Objects API Integration 参考動画 Django + AngularJS | Coding For Entrepreneurs Post Objects API Integration http://127.0.0.1:8000/api/posts/にアクセスすると、djangoのデータベースに…

AngularJS1 + Django REST Frameworkに再挑戦 その2 Angular Templates in Django Part 1

概要 AngularJS1 + Django REST Frameworkに再挑戦 その2 Angular Templates in Django Part 1 参考動画 Django + AngularJS | Coding For Entrepreneurs Angular Templates in Django Part 1 src/ang/init.py と、src/ang/views.pyを作成する。 views.pyは…

AngularJS1 + Django REST Frameworkに再挑戦 その1Django & AngularJS Project

概要 AngularJS1 + Django REST Frameworkに再挑戦 その1Django & AngularJS Project 参考動画 Django + AngularJS | Coding For Entrepreneurs Git & Django Project 以下の動画に従って、django projectをgit cloneする Git & Django Project | Django + …

AngularJS1.5に再挑戦 その19 UI Bootstrap & Typeahead

概要 AngularJS1.5に再挑戦 その19 UI Bootstrap & Typeahead 参考動画・参考サイト Coding for Entrepreneurs AngularJS — Superheroic JavaScript MVW Framework UI Bootstrap & Typeahead UI Bootstrapという、angularJS用のbootstrapがあるらしい!!こ…

AngularJS1.5に再挑戦 その18 Navigation Directive

概要 AngularJS1.5に再挑戦 その18 Navigation Directive 参考動画・参考サイト Coding for Entrepreneurs AngularJS — Superheroic JavaScript MVW Framework Navigation Directive utils/try-nav/try-nav.module.jsと、try-nav.directive.jsを作成する。 /…

AngularJS1.5に再挑戦 その17 Order By & Images

概要 AngularJS1.5に再挑戦 その17 Order By & Images 参考動画・参考サイト Coding for Entrepreneurs AngularJS — Superheroic JavaScript MVW Framework Order By & Images jsondataに、imageのURLを追記する。 [ {"title": "Ne Title", "id":1, "descrip…

AngularJS1.5に再挑戦 その16 Pagination

概要 AngularJS1.5に再挑戦 その16 Pagination 参考動画・参考サイト Coding for Entrepreneurs AngularJS — Superheroic JavaScript MVW Framework Pagination github上のコードを拝借する。michaelbromley/angularUtilsというリポジトリにある。 https://g…

AngularJS1.5に再挑戦 その15 Angular Columns

概要 AngularJS1.5に再挑戦 その15 Angular Columns 参考動画・参考サイト Coding for Entrepreneurs AngularJS — Superheroic JavaScript MVW Framework Angular Columns angular columsを作るには、angularのquery機能などを使う。 'use strict'; angular.…

AngularJS1.5に再挑戦 その14 Bootstrap & CSS

概要 AngularJS1.5に再挑戦 その14 Bootstrap & CSS 参考動画・参考サイト Coding for Entrepreneurs AngularJS — Superheroic JavaScript MVW Framework Bootstrap & CSS BootstrapのCDNバージョンを利用する。index.htmlに読み込ませる。

AngularJS1.5に再挑戦 その13 Confirm Comment Delete

概要 AngularJS1.5に再挑戦 その13 Confirm Comment Delete 参考動画・参考サイト Coding for Entrepreneurs AngularJS — Superheroic JavaScript MVW Framework Confirm Comment Delete delete機能をつける。まずは簡単なものをblog-detail.components.jsに…

AngularJS1.5に再挑戦 その12 Forms and ngSubmit

概要 AngularJS1.5に再挑戦 その12 Forms and ngSubmit 参考動画・参考サイト Coding for Entrepreneurs AngularJS — Superheroic JavaScript MVW Framework Forms and ngSubmit json/posts.jsonにコメント項目を追記する。 [ {"title": "Ne Title", "id":1,…

AngularJS1.5に再挑戦 その11 ngClick & confirmClick Directives

概要 AngularJS1.5に再挑戦 その11 ngClick & confirmClick Directives 参考動画・参考サイト Coding for Entrepreneurs AngularJS — Superheroic JavaScript MVW Framework ngClick & confirmClick Directives ngClickを使ってみる。ngClickの詳しい解説は…

AngularJS1.5に再挑戦 その10 Custom Angular Directive for Confirmed Click

概要 AngularJS1.5に再挑戦 その10 Custon Angular Directive for Confirmed Click 参考動画・参考サイト Coding for Entrepreneurs AngularJS — Superheroic JavaScript MVW Framework Custon Angular Directive for Confirmed Click 公式サイトはこちらを…

AngularJS1.5に再挑戦 その9 ng-resource for mapping to a Restful API

概要 AngularJS1.5に再挑戦 その9 ng-resource for mapping to a Restful API 参考動画・参考サイト Coding for Entrepreneurs AngularJS — Superheroic JavaScript MVW Framework ng-resource for mapping to a Restful API coreフォルダ、postフォルダ、po…

AngularJS1.5に再挑戦 その8 HTTP Request in Angular - $http

概要 AngularJS1.5に再挑戦 その8 HTTP Request in Angular - $http 参考動画・参考サイト Coding for Entrepreneurs AngularJS — Superheroic JavaScript MVW Framework AngularJS1.5に再挑戦 その8 HTTP Request in Angular - $http jsonフォルダを作成す…

AngularJS1.5に再挑戦 その7 ForEach Loop in Angular JS Files

概要 AngularJS1.5に再挑戦 その7 ForEach Loop in Angular JS Files 参考動画・参考サイト Coding for Entrepreneurs AngularJS — Superheroic JavaScript MVW Framework ForEach Loop in Angular JS Files blog-detail.component.jsに追記する。 'use stri…

AngularJS1.5に再挑戦 その6 Detail View with Parameters

概要 AngularJS1.5に再挑戦 その6 Detail View with Parameters 参考動画・参考サイト Coding for Entrepreneurs AngularJS — Superheroic JavaScript MVW Framework Detail View with Parameters blog-detail componentを作成していく。まずは、app/blog-de…

AngularJS1.5に再挑戦 その5 URL Routing Part 1

概要 AngularJS1.5に再挑戦 その5 URL Routing Part 1 参考動画・参考サイト Coding for Entrepreneurs AngularJS — Superheroic JavaScript MVW Framework URL Routing Part 1 ngRouteを利用してみる。 AngularJS $ rackup で開発用サーバ立ち上げておく。 …

AngularJS1.5に再挑戦 その5 Local Webserver for AngularJS and Javascript Apps

概要 AngularJS1.5に再挑戦 その5 URL Routing Part 1 参考動画・参考サイト Coding for Entrepreneurs AngularJS — Superheroic JavaScript MVW Framework Local Webserver for AngularJS and Javascript Apps 以下の動画で、local webserverを立ち上げる必…