Initial commit

.changeset/README.md

@@ -0,0 +1,8 @@
+# Changesets
+
+Hello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that works
+with multi-package repos, or single-package repos to help you version and publish your code. You can
+find the full documentation for it [in our repository](https://github.com/changesets/changesets)
+
+We have a quick list of common questions to get you started engaging with this project in
+[our documentation](https://github.com/changesets/changesets/blob/main/docs/common-questions.md)

.changeset/config.json

@@ -0,0 +1,11 @@
+{
+  "$schema": "https://unpkg.com/@changesets/[email protected]/schema.json",
+  "changelog": "@changesets/cli/changelog",
+  "commit": false,
+  "fixed": [],
+  "linked": [],
+  "access": "public",
+  "baseBranch": "main",
+  "updateInternalDependencies": "patch",
+  "ignore": []
+}

.eslintrc.js

@@ -0,0 +1,5 @@
+module.exports = {
+  root: true,
+  // This tells ESLint to load the config from the package `eslint-config-custom`
+  extends: ["custom"],
+};

.gitignore

@@ -0,0 +1,35 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+node_modules
+.pnp
+.pnp.js
+
+# testing
+coverage
+
+# next.js
+.next/
+out/
+build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+
+# local env files
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# turbo
+.turbo
+
+dist

README.md

@@ -0,0 +1,63 @@
+# tmdb-js
+
+This is the monorepo for the tmdb-js-web and tmdb-js-node packages. Both packages are used to interact with the [TMDB API](https://developers.themoviedb.org/3/getting-started/introduction). The tmdb-js-web package is used for web applications, and the tmdb-js-node package is used for Node.js applications. Both packages are fully-typed TypeScript wrappers for the TMDB API. Currently all endpoints are supported:
+
+- :white_check_mark: V3
+    - :white_check_mark: Account
+    - :white_check_mark: Authentication
+    - :white_check_mark: Certifications
+    - :white_check_mark: Changes
+    - :white_check_mark: Collections
+    - :white_check_mark: Companies
+    - :white_check_mark: Configuration
+    - :white_check_mark: Credits
+    - :white_check_mark: Discover
+    - :white_check_mark: Find
+    - :white_check_mark: Genres
+    - :white_check_mark: Guest sessions
+    - :white_check_mark: Keywords
+    - :white_check_mark: Lists
+    - :white_check_mark: Movies
+    - :white_check_mark: Networks
+    - :white_check_mark: Trending
+    - :white_check_mark: People
+    - :white_check_mark: Reviews
+    - :white_check_mark: Search
+    - :white_check_mark: TV
+    - :white_check_mark: TV Seasons
+    - :white_check_mark: TV Episodes
+    - :white_check_mark: TV Episode Groups
+    - :white_check_mark: Watch Providers
+- :white_check_mark: V4
+    - :white_check_mark: Account
+    - :white_check_mark: Auth
+    - :white_check_mark: List
+
+## Getting started
+For documentation on how to use the tmdb-js-web and tmdb-js-node packages, please see the README files in the packages folder.
+
+tmdb-js-web: [README.md](packages/web/README.md)
+tmdb-js-node: [README.md](packages/node/README.md)
+
+### Useful information
+The tmdb-js-web package uses the [Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) to make requests to the TMDB API. This means that the package is only supported in browsers that support the Fetch API. You can check browser support [here](https://caniuse.com/?search=fetch).
+
+The tmdb-js-node package uses the https module to make requests to the TMDB API. This means that the package is only supported in Node.js versions that support the https module. You can check Node.js support [here](https://nodejs.org/api/https.html).
+
+The V4 endpoints require an access token. You can get an access token by following the instructions [here](https://developers.themoviedb.org/4/getting-started/authentication).
+
+### Build
+
+To build all apps and packages, run the following command:
+
+```
+pnpm run build
+```
+
+### Develop
+
+To develop all apps and packages, run the following command:
+
+```
+pnpm run dev
+```

apps/node-demo/package.json

@@ -0,0 +1,27 @@
+{
+  "name": "node-demo",
+  "version": "1.0.0",
+  "description": "",
+  "private": true,
+  "main": "dist/index.js",
+  "type": "module",
+  "scripts": {
+    "dev": "npm run build -- --watch --onSuccess \"node dist/index.js\"",
+    "build": "tsup --format esm --dts --sourcemap --clean src/index.ts",
+    "lint": "eslint *.ts"
+  },
+  "dependencies": {
+    "tmdb-js-node": "workspace:*"
+  },
+  "devDependencies": {
+    "@types/node": "^18.15.9",
+    "eslint": "^7.32.0",
+    "eslint-config-custom": "workspace:*",
+    "tsconfig": "workspace:*",
+    "tsup": "^6.7.0",
+    "typescript": "^4.5.2"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC"
+}

apps/node-demo/src/index.ts

@@ -0,0 +1,5 @@
+import { TMDBNodeApi } from "tmdb-js-node";
+
+const tmdbApi = new TMDBNodeApi("YOUR_API_KEY");
+
+tmdbApi.v4.list.getList();

apps/node-demo/tsconfig.json

@@ -0,0 +1,12 @@
+{
+  "compilerOptions": {
+    "outDir": "dist",
+    "rootDir": "src",
+    "composite": true,
+    "module": "ESNext",
+    "moduleResolution": "Node",
+    "allowSyntheticDefaultImports": true
+  },
+  "include": ["."],
+  "exclude": ["dist", "node_modules"]
+}

apps/web-demo/.gitignore

@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

apps/web-demo/index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite + React + TS</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>

apps/web-demo/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "web-demo",
+  "private": true,
+  "version": "0.0.1",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "tmdb-js-web": "workspace:*"
+  },
+  "devDependencies": {
+    "@types/react": "^18.0.28",
+    "@types/react-dom": "^18.0.11",
+    "@vitejs/plugin-react": "^3.1.0",
+    "typescript": "^4.9.3",
+    "vite": "^4.2.0"
+  }
+}

apps/web-demo/src/App.css

@@ -0,0 +1,42 @@
+#root {
+  max-width: 1280px;
+  margin: 0 auto;
+  padding: 2rem;
+  text-align: center;
+}
+
+.logo {
+  height: 6em;
+  padding: 1.5em;
+  will-change: filter;
+  transition: filter 300ms;
+}
+.logo:hover {
+  filter: drop-shadow(0 0 2em #646cffaa);
+}
+.logo.react:hover {
+  filter: drop-shadow(0 0 2em #61dafbaa);
+}
+
+@keyframes logo-spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  a:nth-of-type(2) .logo {
+    animation: logo-spin infinite 20s linear;
+  }
+}
+
+.card {
+  padding: 2em;
+}
+
+.read-the-docs {
+  color: #888;
+}

apps/web-demo/src/App.tsx

@@ -0,0 +1,31 @@
+import { useEffect, useState } from "react";
+import "./App.css";
+
+import { SearchMultiSearchResponse, TMDBWebAPI } from "tmdb-js-web";
+
+function App() {
+  const [data, setData] = useState<SearchMultiSearchResponse | null>(null);
+
+  useEffect(() => {
+    const tmdbApi = new TMDBWebAPI("YOUR_API_KEY");
+    tmdbApi.v3.search
+      .searchMulti({
+        query: "star wars",
+      })
+      .then((data) => {
+        setData(data);
+      })
+      .catch((err) => {
+        console.log(err.message);
+      });
+  }, []);
+
+  return (
+    <div className="App">
+      <h1>{data?.results[0]?.title}</h1>
+      <p>{data?.results[0]?.overview}</p>
+    </div>
+  );
+}
+
+export default App;

apps/web-demo/src/index.css

@@ -0,0 +1,69 @@
+:root {
+  font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
+  line-height: 1.5;
+  font-weight: 400;
+
+  color-scheme: light dark;
+  color: rgba(255, 255, 255, 0.87);
+  background-color: #242424;
+
+  font-synthesis: none;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-text-size-adjust: 100%;
+}
+
+a {
+  font-weight: 500;
+  color: #646cff;
+  text-decoration: inherit;
+}
+a:hover {
+  color: #535bf2;
+}
+
+body {
+  margin: 0;
+  display: flex;
+  place-items: center;
+  min-width: 320px;
+  min-height: 100vh;
+}
+
+h1 {
+  font-size: 3.2em;
+  line-height: 1.1;
+}
+
+button {
+  border-radius: 8px;
+  border: 1px solid transparent;
+  padding: 0.6em 1.2em;
+  font-size: 1em;
+  font-weight: 500;
+  font-family: inherit;
+  background-color: #1a1a1a;
+  cursor: pointer;
+  transition: border-color 0.25s;
+}
+button:hover {
+  border-color: #646cff;
+}
+button:focus,
+button:focus-visible {
+  outline: 4px auto -webkit-focus-ring-color;
+}
+
+@media (prefers-color-scheme: light) {
+  :root {
+    color: #213547;
+    background-color: #ffffff;
+  }
+  a:hover {
+    color: #747bff;
+  }
+  button {
+    background-color: #f9f9f9;
+  }
+}

apps/web-demo/src/main.tsx

@@ -0,0 +1,10 @@
+import React from 'react'
+import ReactDOM from 'react-dom/client'
+import App from './App'
+import './index.css'
+
+ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>,
+)