markdown快速+graphql入门体验(代码片段)

author author     2022-12-13     701

关键词:

Express + GraphQL 入门

## Step1: 初始化项目
```
mkdir gql-server & cd gql-server

npm init
```

## Step2: 安装依赖
项目中用到如下依赖
```
npm install graphql express express-graphql --save
```

为了方便, 可以安装`nodemon`, 实现改动代码即可重启服务
```
npm install -g nodemon
```

## Step3: 创建server.js
```
touch server.js
```

## Step4: 编写代码

完整版代码如下:
```javascript
var express = require("express");
var express_graphql = require("express-graphql");
var  buildSchema  = require("graphql");

// GraphQL schema
var schema = buildSchema(`
    type Query 
        message: String
        course(id: Int): Course
        courses(topic: String): [Course]
    ,
    type Mutation 
        updateCourseTopic(id: Int, topic: String!): Course
    
    type Course 
        id: Int
        title: String
        author: String
        description: String
        topic: String
        url: String
    
`);

var coursesData = [
    
        id: 1,
        title: "The Complete Node.js Developer Course",
        author: "Andrew Mead, Rob Percival",
        description: "Learn Node.js by building real-world applications with Node, Express, MongoDB, Mocha, and more!",
        topic: "Node.js",
        url: "https://codingthesmartway.com/courses/nodejs/"
    ,
    
        id: 2,
        title: "Node.js, Express & MongoDB Dev to Deployment",
        author: "Brad Traversy",
        description: "Learn by example building & deploying real-world Node.js applications from absolute scratch",
        topic: "Node.js",
        url: "https://codingthesmartway.com/courses/nodejs-express-mongodb/"
    ,
    
        id: 3,
        title: "JavaScript: Understanding The Weird Parts",
        author: "Anthony Alicea",
        description:
            "An advanced JavaScript course for everyone! Scope, closures, prototypes, this, build your own framework, and more.",
        topic: "JavaScript",
        url: "https://codingthesmartway.com/courses/understand-javascript/"
    
];

var getCourse = function(args) 
    var id = args.id;
    return coursesData.filter(course => 
        return course.id == id;
    )[0];
;

var getCourses = function(args) 
    if (args.topic) 
        var topic = args.topic;
        return coursesData.filter(course => course.topic === topic);
     else 
        return coursesData;
    
;

var updateCourseTopic = function( id, topic ) 
    coursesData.map(course => 
        if (course.id === id) 
            course.topic = topic;
            return course;
        
    );

    return coursesData.filter(course => course.id === id)[0];
;

var root = 
    message: () => "Welcome GraphQL",
    course: getCourse,
    courses: getCourses,
    updateCourseTopic: updateCourseTopic
;

// Create an express server and a GraphQL endpoint
var app = express();

app.use(
    "/graphql",
    express_graphql(
        schema: schema,
        rootValue: root,
        graphiql: true
    )
);

app.listen(4000, () => console.log("Express GraphQL Server Now Running On localhost:4000/graphql"));
```

## Step5: 启动服务
```node
nodemon --inspect ./server.js localhost 4000
```

## Step6: 在打开的网页上直接使用
```node
query message 
  message

```

返回值如下
```node

  "data": 
    "message": "Welcome GraphQL"
  

```

其他方法示例如下:
```
query message 
  message


query getSingleCourse($courseID: Int!) 
  course(id: $courseID) 
    title
    author
    description
    topic
    url
  


query getCourseWithFragments($courseID1: Int!, $courseID2: Int!) 
      course1: course(id: $courseID1) 
             ...courseFields
      ,
      course2: course(id: $courseID2) 
            ...courseFields
       


fragment courseFields on Course 
  title
  author
  description
  topic
  url


query getCourses($courseTopic: String!) 
  courses(topic: $courseTopic) 
    ...courseFields
  


mutation updateCourseTopic($id: Int!, $topic: String!) 
  updateCourseTopic(id: $id, topic: $topic) 
    ... on Course 
      title
      author
      description
      topic
      url
    
  

```

参数示例如下: 
```

  "$courseID": 1


 
    "courseID1":1,
    "courseID2":2



  "courseTopic": "Node.js"



  "id": 1,
  "topic": "JavaScript"


```


## 使用`Postman`直接请求

```
http://localhost:4000/graphql?query=query getSingleCourse($courseID: Int!) 
  course(id: $courseID) 
    title
    author
    description
    topic
    url
  
&variables="courseID" : 1
```

返回值如下:
```

    "data": 
        "course": 
            "title": "The Complete Node.js Developer Course",
            "author": "Andrew Mead, Rob Percival",
            "description": "Learn Node.js by building real-world applications with Node, Express, MongoDB, Mocha, and more!",
            "topic": "Node.js",
            "url": "https://codingthesmartway.com/courses/nodejs/"
        
    

```










  





















markdown快速入门(代码片段)

Markdown:Basics(快速入门)段落、标题、区块代码一个段落是由一个以上的连接的行句组成,而一个以上的空行则会划分出不同的段落(空行的定义是显示上看起来像是空行,就被视为空行,例如有一行只有空白和tab,那该行也会... 查看详情

三分钟上手markdown——基本语法快速入门(代码片段)

最近爱上了用Markdown写博客,哈哈!你问我为什么?主要是用不着鼠标,全凭手敲解决问题,爽呀~好吧,我只是小菜鸟,发现了新大陆,文中表述有误评论马上修改!1.标题标题的语法是这样的&... 查看详情

markdown基本语法快速入门

thisisaLists,lookIlikeyouIlikeyouIlikeyouIlikeyouIlikeyouIlikeyouIlikeyouIlikeyouIlikeyouIlikeyou 查看详情

markdown语法快速入门

#markdown语法快速入门>只记住下面的语法就可以满足日常使用了 **强调***斜体*~~划掉~~++下划线++==字体颜色==#标题一##标题二###标题三####标题四#####标题五######标题六---分割线>引用的文字-无序列表-无序列表-无序列表1.有... 查看详情

markdown快速入门

650)this.width=650;"src="https://images2015.cnblogs.com/blog/636325/201607/636325-20160712160525154-146051881.png"style="margin:0px;padding:0px;border:0px;"/>Markdown是一种轻量级标记语言,它用简洁的语法代替排版,而不像一般我们用的字处 查看详情

markdown更新graphql类型(代码片段)

查看详情

markdown:basics(快速入门)

GettingtheGistofMarkdown‘sFormattingSyntax此页提供了Markdown的简单概念, 语法说明 页提供了完整详细的文档,说明了每项功能。但是Markdown其实很简单就可以上手,此页文档提供了一些范例,并且每个范例都会提供输出的HTML结... 查看详情

半小时学会markdown语法,让你从快速入门到熟练掌握typora编辑器,大家记笔记写讲义都在用。(代码片段)

文章目录Markdown简介Markdown主要应用Markdown编辑器Typroa编辑器Markdown语法Markdown标题Markdown段落字体分隔线删除线下划线脚注Markdown列表无序列表有序列表列表嵌套Markdown区块区块嵌套区块中使用列表列表中使用区块Markdown代码段落内... 查看详情

分布式任务调度系统xxl-job快速入门体验(代码片段)

背景为了能够更加灵活的控制定时任务,最近在项目中开始推行定时任务调度系统,跟不少大厂朋友交流之后,发现XXL-Job市场还是挺广的,功能强大,定为首选。再加上XXL-Job是基于SpringBoot的开源项目,二... 查看详情

markdown错误:使用graphql接口时的启发式错误(代码片段)

查看详情

atom编辑器入门到精通markdown支持(代码片段)

...了编写代码,不过Atom还支持编辑很多其他格式的文件.比如Markdown和Asciidoc.这一章中我们主要学习如何快速方便地编辑Markdown文件.另外在写这篇博文的时候我又换回Linux了,因此以后文章里提到的快捷键和操作方式都将以Linux为标准.... 查看详情

splunk入门体验(代码片段)

...和复杂的多行应用程序日志。​它允许您以可重复的方式快速,可重复地收集,存储,索引,搜索,关联,可视化,分析和报告任何日志数据或机器生成的数据,以识别和解决操作和安全问题。​此外,splunk还支持各种日志管理... 查看详情

快速体验react开发基础入门指南

前言大家好,我是CoderBin,本次整理了我学习react过程中的各部分的知识点,看完文本你将会学到jsx的基本使用使用脚手架创建项目如何在React当中定义组件React当中的事件绑定方式以及注意事项关于react组件的三大核心属性及其... 查看详情

记录一下dubbo的快速入门(代码片段)

...RPC采用dubbo框架作为治理框架,对外接口采用RESTful和GraphQL接口方式所以学习一下dubbo是很有必要的1、什么是Dubbo官网:https://dubbo.apache.org/zh/docs/背景介绍ApacheDubbo™(incubating)是一款高性能Ja 查看详情

markdown来自graphql-yoga(后端)的prisma服务器连接测试(代码片段)

查看详情

feign入门之快速实战(代码片段)

...Template实战1.引入依赖2.添加注解3.编写Feign的客户端4.测试快速实战总结问题引入先来看我们以前利用RestTemplate发起远程调用的代码:就这样的代码,存在下面的问题:代码可读性差,编程体验不统一参数复杂URL难... 查看详情

markdown被动学习,主动学习,体验式学习(代码片段)

查看详情

markdown入门(代码片段)

查看详情