In the video "Build A Blog in 15 (more like 30) Minutes: Webpacker Edition" by Sasha Grodzins, presented at RailsConf 2018, the speaker guides the audience through a live coding session where he builds a blog application using a Rails backend combined with a React frontend and a GraphQL API. This session serves as a modern homage to David Heinemeier Hansson's original talk on Ruby on Rails, where a blog was built in a mere 15 minutes. However, Grodzins notes that his version is unlikely to be completed that quickly due to added complexities.

Key Points Discussed:

• Introduction to Technologies:

  • Grodzins introduces the main technologies used, which include Rails for the backend, GraphQL for API communication, and React for the frontend views.
  • He explains that GraphQL was created by Facebook to solve issues commonly found in traditional REST APIs, notably by providing a single endpoint and allowing clients to specify exactly which data they need.

• Project Setup:

  • The initial setup of the Rails application with Webpacker is discussed, highlighting the significant reduction in configuration time thanks to Rails 5 and Webpacker.
  • The speaker executes the rails new command with the Webpacker extension and explains the necessary bundling and setup steps performed at the beginning.

• Creating the Blog Structure:

  • The creation of the blog container and the integration of React components are demonstrated.
  • Grodzins explains how to structure components and utilize JSX for rendering views, emphasizing the component lifecycle methods, particularly componentDidMount() for data fetching.

• GraphQL Implementation:

  • Grodzins walks through setting up GraphQL types and mutations, including creating a query to fetch blog posts and a mutation for deleting posts.
  • The use of a self-documenting nature of GraphQL is highlighted, where developers can interactively explore GraphQL queries.

• State Management and Data Display:

  • State management in React is addressed, where the fetched data from GraphQL is set to state and rendered in the component.
  • The speaker demonstrates listing post titles and contents by querying the GraphQL API.

• CRUD Functionality:

  • The implementation of create, read, update, and delete functionalities is completed within the live coding session, showcasing how to modify the application without needing a page refresh.
  • A brief mention of adding form components for creating new blog posts and inline editing features of existing posts is provided.

Conclusion:
Grodzins successfully builds a fully functioning blog application, demonstrating the ease of integrating Rails with React and GraphQL. The session illustrates the modern web development stack's capabilities while educating attendees on best practices for structuring React applications within a Rails framework.