• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

MatthieuSegret/graphql-rails-blog: Blog App built with Rails 5, React and GraphQ ...

原作者: [db:作者] 来自: 网络 收藏 邀请

开源软件名称(OpenSource Name):

MatthieuSegret/graphql-rails-blog

开源软件地址(OpenSource Url):

https://github.com/MatthieuSegret/graphql-rails-blog

开源编程语言(OpenSource Language):

TypeScript 57.4%

开源软件介绍(OpenSource Introduction):

GraphQL Rails Blog

This application can be used as starter kit if you want to get started building an app with Rails, React, and GraphQL. This is a simple blog engine using ordinary features which can be found in most web applications.

If you are interested by Elixir, I created a similar application with Phoenix and Absinthe that you might like: Yummy Phoenix GraphQL.

Technologies

Frontend

  • TypeScript - A superset of JavaScript that compiles to clean JavaScript output.
  • React - A JavaScript library for building user interfaces. It introduces many great concepts, such as, Virtual DOM, Data flow, etc.
  • Create React App - is a new officially supported way to create single-page React applications. It offers a modern build setup with no configuration.
  • Bulma - Bulma is a modern CSS framework based on Flexbox
  • Apollo 2 - A flexible, fully-featured GraphQL client for every platform.
  • React Final Form - High performance subscription-based form state management for React.

Backend

  • Ruby 2.4
  • Rails 5.1
  • GraphQL-Ruby - GraphQL-Ruby is a Ruby implementation of GraphQL.
  • GraphQL-batch - GraphQL-batch is a query batching executor for the graphql gem.
  • Graphiql - Graphiql is an in-browser IDE for exploring GraphQL.
  • Rack CORS - Rack Middleware for handling Cross-Origin Resource Sharing (CORS), which makes cross-origin AJAX possible.
  • Optics Agent - Optics Agent for GraphQL Monitoring
  • SQLite3 for development and PostgreSQL for production.

Features

  • CRUD (create / read / update / delete) on posts
  • Creating comments on post page
  • Pagination on posts listing
  • Searching on posts
  • Authentication with Devise and authorizations (visitors, users, admins)
  • Creating user account
  • Update user profile and changing password
  • Setup dev tools
  • Application ready for production

GraphQL Using

  • Queries et mutations
  • FetchMore for pagination
  • Using apollo-cache-inmemory
  • Apollo Link (dedup, onError, auth)
  • Managing local state with Apollo Link
  • Optimistic UI
  • Static GraphQL queries
  • Validation management and integration with Final Form
  • Authentication and authorizations
  • Protect queries and mutations on GraphQL API
  • Batching of GraphQL queries into one HTTP request
  • Batching of SQL queries backend side

Prerequisites

Getting Started

  • Install Bundler

        $ gem install bundler
    
  • Checkout the graphql-rails-blog git tree from Github

        $ git clone https://github.com/MatthieuSegret/graphql-rails-blog.git
        $ cd graphql-rails-blog
        graphql-rails-blog$
    
  • Run Bundler to install/bundle gems needed by the project:

        graphql-rails-blog$ bundle
    
  • Create the database:

        graphql-rails-blog$ rails db:migrate
    
  • Load sample records:

        graphql-rails-blog$ rails db:seed
    
  • Run the Rails server in development mode

        graphql-rails-blog$ rails server
    
  • Run Yarn to install javascript package in other terminal:

        graphql-rails-blog$ cd client
        graphql-rails-blog/client$ yarn
    
  • Start client in development mode. You should be able to go to http://localhost:8080 :

          graphql-rails-blog/client$ yarn start
    

Next step

  • Use subscription GraphQL feature
  • Create mobile app with React Native

Screens

Listing posts

Listing posts

Creating comments

Creating comments

Post page

Post page

Editing post

Editing post

License

MIT © Matthieu Segret




鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
SimonDegraeve/hapi-graphql: Create a GraphQL HTTP server with Hapi.发布时间:2022-06-22
下一篇:
kkemple/graphql-auth: 发布时间:2022-06-22
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap