Giter VIP home page Giter VIP logo

bighorn-website's Introduction

redwoodjs.com

This repo contains the latest iteration of redwoodjs.com, redesigned for our Bighorn launch.

Development Quick Start

yarn install

.env

You'll need to create a .env file. Start with this in the file:

DATABASE_URL=
SESSION_SECRET=

We're using the database to save Newsletter submissions.

The production database is using Neon.tech

Updating the Content on the Site

All the content on the site is controlled through markdown files in the content directory.

To preview the content changes you've made locally, you'll need to run:

yarn build:content

If everything runs successfully, you'll see a message like this:

Unfortunately, the displayed error message, is a known issue with Contentlayer. (See Issues 598 and 495)

This script generates a .contentlayer folder inside the project's root.

Changelog

---
publishDate: 2024-02-01
published: true
---

Since we're using mdx, you can also include React components within the content. Right below the frontmatter, import the component, using an absolute path:

import Browser from 'web/src/components/Browser/Browser'

Then, you can use the component in the content:

<Browser><div>Some code</div></Browser>

I've created a couple of components that you can use:

  • <Browser />
  • <Video />

I've also installed Prism.js for formatting code blocks.

Events

---
title: "Maker Hour"
date: 2024-01-24T18:00:00-05:00
description: "Each week, we meet to support each other and discuss projects we’re building on top of RedwoodJS."
rsvp: 'https://lu.ma/redwoodjs'
---

Roadmap

---
title: "Autoscaling for dedicated PostgreSQL clusters"
description: "Access and work in your own configurable PostgreSQL cluster, complete with autoscaling support."
status: "soon"
---

Possible status values are: soon, later, planned, and done

Icons

All the icons on the site are delivered through a generated SVG sprite. To add a new icon, add a 24x24 SVG file to the scripts/svg-icons directory. Then, run:

yarn build:icons

This will generate a new icons/sprite.svg file and a corresponding type file (name.d.ts) in the web/public directory.

The new icon will be available within the Icon component, using the same name as the SVG file. For example, github.svg can be displayed using:

<Icon id="github" />

Blog Posts

Blog posts are written and managed inside Hashnode.

Caching

While blog posts and publications are fetched from Hashnode, Redwood's GraphQL server is also caching its responses.

See the graphql function for the useResponseCache config.

Invalidating

The GraphQL mutations:

  • invalidatePost(slug: string)
  • invalidatePosts

will purge the Posts from the response cache.

curl -X POST -H "Content-Type: application/json" --data '{ "query": "mutation { invalidatePosts }" }' https://redwoodjs.com/.netlify/functions/graphql
curl -X POST -H "Content-Type: application/json" --data '{ "query": "mutation { invalidatePost(slug: \"rsc-now-in-redwoodjs\") }" }' https://redwoodjs.com/.netlify/functions/graphql
curl -X POST -H "Content-Type: application/json" --data '{ "query": "query { post(slug: \"rsc-now-in-redwoodjs\") { id, title } }" }' https://redwoodjs.com/.netlify/functions/graphql

A webhook at /

For example:

curl http://localhost:8911/whInvalidatePostsHook

Where the hostname is local or

curl https://redwoodjs.com/.netlify/functions/whInvalidatePostsHook

in production.

Note: Since the webhook is signed, you'd need the secret as well, but Hashnode provides this for the webhook.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.