Merge pull request #196 from GautierArcin/feature/add_newsletter

feat: add newsletter

pages/api/buttondown.js

@@ -0,0 +1,31 @@
+// eslint-disable-next-line import/no-anonymous-default-export
+export default async (req, res) => {
+  const { email } = req.body
+  if (!email) {
+    return res.status(400).json({ error: 'Email is required' })
+  }
+
+  try {
+    const API_KEY = process.env.BUTTONDOWN_API_KEY
+    const buttondownRoute = `${process.env.BUTTONDOWN_API_URL}subscribers`
+    console.log('route : ', buttondownRoute)
+    const response = await fetch(buttondownRoute, {
+      body: JSON.stringify({
+        email,
+      }),
+      headers: {
+        Authorization: `Token ${API_KEY}`,
+        'Content-Type': 'application/json',
+      },
+      method: 'POST',
+    })
+
+    if (response.status >= 400) {
+      return res.status(500).json({ error: `There was an error subscribing to the list.` })
+    }
+
+    return res.status(201).json({ error: '' })
+  } catch (error) {
+    return res.status(500).json({ error: error.message || error.toString() })
+  }
+}

pages/api/convertkit.js

@@ -0,0 +1,36 @@
+/* eslint-disable import/no-anonymous-default-export */
+export default async (req, res) => {
+  const { email } = req.body
+  console.log('email : ', email)
+
+  if (!email) {
+    return res.status(400).json({ error: 'Email is required' })
+  }
+
+  try {
+    const FORM_ID = process.env.CONVERTKIT_FORM_ID
+    const API_KEY = process.env.CONVERTKIT_API_KEY
+    const API_URL = process.env.CONVERTKIT_API_URL
+
+    // Send request to ConvertKit
+    const data = { email, api_key: API_KEY }
+
+    const response = await fetch(`${API_URL}forms/${FORM_ID}/subscribe`, {
+      body: JSON.stringify(data),
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      method: 'POST',
+    })
+
+    if (response.status >= 400) {
+      return res.status(400).json({
+        error: `There was an error subscribing to the list.`,
+      })
+    }
+
+    return res.status(201).json({ error: '' })
+  } catch (error) {
+    return res.status(500).json({ error: error.message || error.toString() })
+  }
+}

pages/api/mailchimp.js

@@ -0,0 +1,25 @@
+import mailchimp from '@mailchimp/mailchimp_marketing'
+
+mailchimp.setConfig({
+  apiKey: process.env.MAILCHIMP_API_KEY,
+  server: process.env.MAILCHIMP_API_SERVER, // E.g. us1
+})
+
+// eslint-disable-next-line import/no-anonymous-default-export
+export default async (req, res) => {
+  const { email } = req.body
+
+  if (!email) {
+    return res.status(400).json({ error: 'Email is required' })
+  }
+
+  try {
+    const test = await mailchimp.lists.addListMember(process.env.MAILCHIMP_AUDIENCE_ID, {
+      email_address: email,
+      status: 'subscribed',
+    })
+    return res.status(201).json({ error: '' })
+  } catch (error) {
+    return res.status(500).json({ error: error.message || error.toString() })
+  }
+}

pages/index.js

@@ -5,6 +5,8 @@ import siteMetadata from '@/data/siteMetadata'
 import { getAllFilesFrontMatter } from '@/lib/mdx'
 import formatDate from '@/lib/utils/formatDate'
 
+import { FormSubscribe } from '@/components/FormSubscribe'
+
 const MAX_DISPLAY = 5
 
 export async function getStaticProps() {
@@ -89,6 +91,16 @@ export default function Home({ posts }) {
           </Link>
         </div>
       )}
+      {siteMetadata.newsletter.provider !== '' && (
+        <div className="flex flex-col md:flex-row justify-between items-center">
+          <h1 className="text-3xl font-extrabold tracking-tight text-gray-900 dark:text-gray-100 sm:text-4xl md:text-6xl ">
+            Newsletter
+          </h1>
+          <div className="p-5">
+            <FormSubscribe />
+          </div>
+        </div>
+      )}
     </>
   )
 }