Google Cloud Endpoints의 애니메이션 정보 API에 대한 클라이언트 사이트를 만들었습니다. ( Anime Info Client )

구성

JavaScript는 쓸 수 있는 기분이 없기 때문에 TypeScript로 작성.
CSS는 커녕 HTML도 잘 모르기 때문에 Bootstrap에서 그것 같은 느낌으로 했다.
GAE에서 만들었기 때문에 쓸데없이 HTTPS.
Bootstrap 덕분에 스마트폰 대응도 간단하게 할 수 있었다. 편리.

API 호출

Google Cloud Endpoints에서 작성한 API는 JavaScript client library를 사용하여 API를 두드릴 수 있으므로 이것을 사용하여 작성했다.
시도하지는 않지만 Android와 iOS 라이브러리도 만들 수있는 것 같습니다.

사이트 설명

왼쪽 상단의 방송 기간을 선택하면 해당 애니메이션 목록을 서버로 가져 와서 오른쪽 애니메이션 목록을 업데이트합니다.
애니메이션을 선택하면 아래 양식이 업데이트됩니다.


버튼
설명


새로운
애니메이션의 신규 작성용. 양식을 비우는 것만으로 통신을하지 않습니다. 정보를 입력하고 저장 버튼을 눌러 데이터베이스를 업데이트합니다.

Save
애니메이션 정보 갱신용 버튼. ID가 들어 있는 경우는 덮어쓰기. ID가 들어 있지 않은 경우는 신규 작성이 된다.

Delete
데이터베이스에서 해당 ID의 애니메이션 정보를 삭제합니다.


데이타베이스적으로는 해시태그, 별명은 3개 이상 보존할 수는 있지만, UI 만드는 것이 어려웠기 때문에, 3개로 제한하고 있다.

소스 코드

거미 2 지 / 아니 메인 후 C 엔 t