luveqz / veganhacktivists

The veganhacktivists.org website, built using Next.js and hosted on our Digital Ocean Docker droplet

Vegan Hacktivists

Our official website. On here you can find information about the different projects Vegan Hacktivists has been working on throughout the last couple of years. You can also find out what services we provide, who we are, who we partner with and read our blog.

Introduction

Team Avocado is the new JavaScript focused team of the Vegan Hacktivists. We're going to take on more projects in the future, but as the first one we're gonna rebuild our old main website https://veganhacktivists.org/ ➡️ https://new.veganhacktivists.org/.

We're using Next.js and Tailwind for that. In this trello board you can find more stuff in the info column, for example, some of the images to be used, fonts, colors... On the board you can also access the Things to do cards. If you are doubting which card to pick first, talk to Joaquín [TL] 🇪🇸 and we'll take a look at the available ones or even create others, in order for you to get used to the project.

Because this team is so new we still have to document all of this somewhere, so reach out to the #🥑vegan-hacktivists channel on Discord if you need anything or something is missing! 💚

Table of contents

• Vegan Hacktivists
  • Introduction
  • Table of contents
  • Getting Started
    • Coding conventions and guidelines
    • Configuring your editor
  • Grab a card
  • Frequently Asked Questions
    • How should URLs be formatted?
  • Resources

Getting Started

Install the dependencies:

yarn install

Install the hooks:

yarn husky install

Run the development server:

yarn dev

Open http://localhost:3000 with your browser to see the result.

API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.tsx.

The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.

Coding conventions and guidelines

We are still figuring this out as we go, but for now we follow these guidelines for TypeScript and these conventions for React.

As for Git conventions, we try to follow the style guide as described here.

Configuring your editor

It is recommended to install EditorConfig, Prettier and ESLint, although the commit hooks will already take care of the formatting.

It is also recommended to activate the Editor: Format on save option.

Grab a card

Steps for working on a card from our Trello board:

• Grab a card from the Things to do column and drag it to the In Progress column
• Create a new branch feature/my-new-feature off the main branch
• Create a Pull Request when you're done
• Move the card to PR Ready
• Sit back and wait for approvals or comments!

Feel free to ask other team members to review Pull Requests.

Frequently Asked Questions

How should URLs be formatted?

URLs should use dashes (-) instead of underscores (_), so /this-is/my/page instead of /this_is/my/page?

Resources

To learn more about Next.js, take a look at the following resources:

• Next.js Documentation - learn about Next.js features and API.
• Learn Next.js - an interactive Next.js tutorial.

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!