clean up

ragudesign · Feb 6, 2022 · 5be8f23 · 5be8f23
1 parent 68de524
commit 5be8f23
Show file tree

Hide file tree

Showing 3 changed files with 106 additions and 37 deletions.
diff --git a/LICENSE b/LICENSE
@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022 ragudesign
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
diff --git a/README.md b/README.md
@@ -1,34 +1,85 @@
-This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
+<!-- PROJECT LOGO -->
+<br />
+<div align="center">
+  <a href="https://github.com/othneildrew/Best-README-Template">
+    <img src="https://user-images.githubusercontent.com/21065594/152661449-28ff66fe-9d6c-4d65-9a47-6d6848f232eb.svg" alt="Logo" width="240" height="80">
 
-## Getting Started
+  </a>
 
-First, run the development server:
+  <h3 align="center">WordPress WPGraphQL NextJS App</h3>
 
-```bash
-npm run dev
-# or
-yarn dev
-```
+  <p align="center">
+    This Next.js app connects to a WordPress WPGraphQL endpoint
+    <br />
+
+[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fragudesign%2Ffaq-desk-nextjs&env=WORDPRESS_GRAPHQL_URL)
+    <br />
+    <br />
+    <a href="https://faq-desk-nextjs.vercel.app/" target="_blank">View Demo</a>
+    ·
+    <a href="https://github.com/ragudesign/faq-desk-nextjs/issues/new">Report Bug</a>
+    ·
+    <a href="https://github.com/ragudesign/faq-desk-nextjs/issues/new">Request Feature</a>
+    ·
+    <a href="https://github.com/ragudesign/faq-desk-wp">WordPress Plugin</a>
+  </p>
+</div>
 
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+<br>
+<br>
 
-You can start editing the page by modifying `pages/index.js`. The page auto-updates as you edit the file.
+<!-- ABOUT THE PROJECT -->
+## :wave: About The Project
 
-[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.js`.
+I started this project to learn more about Next.js and how i can use WordPress headless by exposing the data via WPGraphQL plugin. I created a small app which gets the posts from a custom post type and a search that uses a local json file so it's super quick which is generated on build.
 
-The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
+![image](https://user-images.githubusercontent.com/21065594/152663399-9eef21df-0e32-4a0e-b7ea-34339d958369.png)
 
-## Learn More
 
-To learn more about Next.js, take a look at the following resources:
 
-- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
-- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+<!-- GETTING STARTED -->
+## :rocket: Getting Started
 
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
+### Prerequisites
+
+Setup a WordPress installation and add the following plugins:
+* Install FAQ Desk WP Plugin
+  ```sh
+  https://github.com/ragudesign/faq-desk-wp
+  ```
+
+* Install WPGraphQL Plugin
+  ```sh
+  https://www.wpgraphql.com/
+  ```
+
+### Installation
+
+1. Clone the repo
+```bash
+yarn create next-app -e https://github.com/ragudesign/faq-desk-nextjs
+# or
+npx create-next-app -e https://github.com/ragudesign/faq-desk-nextjs
+```
+
+2. Add a .env file to the root with the following:
+```
+WORDPRESS_GRAPHQL_ENDPOINT=http://wordpressite.com/graphql
+```
+
+### Development
+
+To start the project locally, run:
+
+```bash
+yarn dev
+# or
+npm run dev
+```
 
-## Deploy on Vercel
+<br>
 
-The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
+<!-- LICENSE -->
+## :frog: License
 
-Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
+Distributed under the MIT License. See `LICENSE` for more information.
diff --git a/scripts/build-search.js b/scripts/build-search.js
@@ -4,21 +4,19 @@ require('dotenv').config()
 
 const WP_API = process.env.WORDPRESS_GRAPHQL_URL
 
-
 async function fetcher(query) {
 
-    const res = await fetch(WP_API, {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({ query })
-    })
+  const res = await fetch(WP_API, {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify({ query })
+  })
 
-    const json = await res.json()
-    return json
+  const json = await res.json()
+  return json
 
 }
 
-
 const query = `query getTitleSlugs {
     faqs {
       nodes {
@@ -28,18 +26,17 @@ const query = `query getTitleSlugs {
     }
   }`
 
-
 async function buildJSON() {
 
-    const response = await fetcher(query);
+  const response = await fetcher(query);
 
-    const titleSlugs = response.data.faqs.nodes
+  const titleSlugs = response.data.faqs.nodes
 
-    const fullParams = `${JSON.stringify(titleSlugs)}`
+  const fullParams = `${JSON.stringify(titleSlugs)}`
 
-    fs.writeFile(process.cwd() + '/public/search.json', fullParams, function (err) {
-        if (err) return console.log(err);
-    })
+  fs.writeFile(process.cwd() + '/public/search.json', fullParams, function (err) {
+    if (err) return console.log(err);
+  })
 }
 
-buildJSON()
+buildJSON()