GraphQL Books & Authors API

A full-stack GraphQL application for managing books and authors, built with TypeScript, Express, and a responsive frontend.

🚀 Features

• GraphQL API with queries and mutations
• TypeScript for type safety
• Responsive Frontend with vanilla HTML/CSS/JavaScript
• CRUD Operations for books and authors
• GraphiQL Playground for API exploration
• CORS enabled for cross-origin requests

📁 Project Structure

graphql-basic/
├── src/
│   └── server.ts          # Main server file with GraphQL schema
├── public/
│   └── index.html         # Frontend interface
├── dist/                  # Compiled JavaScript output
├── package.json
├── tsconfig.json
└── README.md

🛠️ Installation

1. Clone or download the project

2. Install dependencies:

   npm install

3. Build the TypeScript project:

   npm run build

4. Start the server:

   npm start

🎯 Usage

Development Mode

For development with auto-reload on file changes:

npm run dev

Production Mode

1. Build the project:

   npm run build

2. Start the server:

   npm start

Watch Mode

To automatically compile TypeScript on changes:

npm run watch

🌐 Endpoints

• Frontend Interface: http://localhost:4000
• GraphQL API: http://localhost:4000/graphql
• GraphiQL Playground: http://localhost:4000/graphql

📖 API Documentation

Queries

Get all books

query {
  books {
    id
    name
    author {
      id
      name
    }
  }
}

Get all authors

query {
  authors {
    id
    name
    books {
      id
      name
    }
  }
}

Get a single book by ID

query {
  book(id: 1) {
    id
    name
    author {
      id
      name
    }
  }
}

Mutations

Add a new book

mutation {
  addBook(name: "New Book Title", authorId: 1) {
    id
    name
    author {
      id
      name
    }
  }
}

Add a new author

mutation {
  addAuthor(name: "New Author Name") {
    id
    name
    books {
      id
      name
    }
  }
}

🎨 Frontend Features

The web interface provides:

• View Books: Display all books with their authors
• Add Books: Form to add new books with author selection
• View Authors: Display all authors with their book counts
• Add Authors: Form to add new authors
• Real-time Updates: Automatic refresh after adding items
• Error Handling: User-friendly error messages

🔧 Technology Stack

• Backend: Node.js, Express, GraphQL
• Frontend: HTML5, CSS3, Vanilla JavaScript
• Language: TypeScript
• Development: ts-node-dev for hot reload

📦 Dependencies

Production

• express - Web framework
• express-graphql - GraphQL middleware for Express
• graphql - GraphQL implementation

Development

• typescript - TypeScript compiler
• @types/express - Type definitions for Express
• @types/node - Type definitions for Node.js
• ts-node-dev - Development server with auto-reload
• nodemon - File watcher for development

🚀 Getting Started

1. Start the server:

   npm run dev

2. Open your browser:

   • Frontend: http://localhost:4000
   • GraphQL Playground: http://localhost:4000/graphql

3. Try the API:

   • Use the frontend to add books and authors
   • Explore the API in GraphiQL playground
   • Test queries and mutations

📝 Sample Data

The application comes with sample data:

Authors:

• J. K. Rowling
• J. R. R. Tolkien
• Brent Weeks

Books:

• Harry Potter series (by J. K. Rowling)
• Lord of the Rings trilogy (by J. R. R. Tolkien)
• Night Angel series (by Brent Weeks)

🤝 Contributing

1. Fork the project
2. Create a feature branch
3. Make your changes
4. Test your changes
5. Submit a pull request

📄 License

This project is licensed under the ISC License.

---

Happy coding! 🚀