Templates

HTML Template

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <!-- <meta name="description" content="..." /> -->
  <!-- <link rel="icon" href="./favicon.ico" type="image/x-icon" /> -->
  <!-- <link rel="stylesheet" href="https://d2fwvgwkmab2g5.cloudfront.net/Good.css" type="text/css" /> -->
  <!-- <link rel="stylesheet" href="./styles.css" type="text/css" /> -->
  <!-- <script src="./javascript.js" type="text/javascript"></script> -->
  <style>
    /* CSS code goes here... */
    p {
      color: blue;
    }
  </style>
  <title> HTML Page </title>
</head>
<body>

  <div>
    <p> Hello! Welcome to my very simple web page. </p>
  </div>

<script>
  // JavaScript code goes here...
  console.log("Hello! Welcome to the console.");
</script>
</body>
</html>

CSS Template

div {
  /* Outer Box */

  display: block;
  visibility: visible;
  opacity: 1;

  background-color: aliceblue;
  border: 2px solid black;
  border-radius: 20px;
  box-shadow: 4px 4px black;
  box-sizing: border-box; /* content-box */
  overflow: visible;

  height: 500px;
  width: 500px;
  margin: 20px;
  padding: 20px;

  white-space: nowrap;

  position: absolute;
  top: 100px;
  bottom: 0px;
  left: 100px;
  right: 0px;

  /* Inner Text */

  color: rgb(150, 0, 255);
  font-family: monospace;
  font-size: 16px;
  font-weight: bold;
  font-style: normal;

  text-align: center;
  /* text-indent: 0px; */
  /* text-transform: none; */
  /* text-decoration: none; */
  /* text-shadow: 0px 0px 0px #000000; */
  /* vertical-align: middle; */
  /* line-height: 1.4em; */
  /* letter-spacing: auto; */
  /* word-spacing: auto; */
}

Basic React Component Template

import './Component.css';

function Component() {
  return (
    <h1> Component </h1>
  )
}

export default Component;

Accordion Component Template

<div class="AccordionOuterBox">
  <div class="AccordionHeader">
    <h3 class="AccordionHeaderTitle">  </h3>
    <svg xmlns="http://www.w3.org/2000/svg" fill="var(--text)" class="DownArrow arrow_icon" viewBox="0 0 16 16">
      <path d="M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z" />
    </svg>
  </div>

  <div class="AccordionInnerBox">
    <div class="AccordionInnerContent">
      <!-- Insert Inner Accordion Content Here -->


    </div>
  </div>
</div>

README Template

# Project README

This is a description of the project.

## Dependencies

- `react`
- `node`

## Local Setup

1. Install Dependencies

```sh
npm install
```

2. Run the Client

```sh
cd client
npm run dev
```

3. Run the Server

```sh
cd server
node server.js
```

## Project Structure

```
```

## Database Schema

![database_schema](public/Schema.png)

## Exposed End Points

<details>
  <summary> End Point 1 - Retrieve a User </summary>

**Request**

```http
GET /api/v1/users/1
Content-Type: application/json
Accept: application/json
```

**Response & Response Code** `200`

```json
{
  "data": {
    "id": 1,
    "type": "user",
    "attributes": {
      "first_name": "Grant",
      "last_name": "Davis",
      "email": "grant@gmail.com"
    }
  }
}
```
</details>

## Contributors

- Grant Davis

.gitignore Template

# .gitignore

# List all files and directories you wish to ignore.
# See more here: https://git-scm.com/docs/gitignore

# Environment Files
.env
.env.*
!.env.example

# OS
/.DS_Store
**/.DS_Store
Thumbs.db

# Dependencies
/node_modules

# Build Output
/dist
/dist-ssr

# Local Config
*.local

# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*

# Editor
.vscode/*
!.vscode/extensions.json
!.vscode/settings.json
.idea
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

# Misc
coverage
.cache
*.tsbuildinfo

.prettierignore Template

# .prettierignore

# Dependencies
/node_modules

# Build output
build
dist
coverage

# Misc
*.log

# Lockfiles
package-lock.json

# Environment Files
.env
.env.*

# Generated / Cache
.vite

.prettierrc Template

{
  "singleQuote": false,
  "semi": true,
  "trailingComma": "es5"
}

GitHub PR Template

# Summary

### Ticket:

The goal of this ticket is to...

## Details

I created...

**Test Cases**

-

## Test Coverage

- How Many: `?`
- Located in: `?`

Reset the database and run Vitest:

```sh

```

## Notes

- No notes.

## Considerations & Next Steps

- No next steps currently.

Project Template

# New Project

- Start Date:
- End Date:

What are we building and why?
What does "done" look like?
How do we get there? How are we going to build it?
How do we know it works?

## Planning & Requirements

### Problem & Purpose
### Goals

## Design

### Core Ideas
### User Flow & Interaction
### Key Decisions or Constraints

## Build

### MVP Features
### Technical Approach
### Implementation Notes

## Validate

### Tests & Checks
### How Success is Measured
### Feedback / Iteration Notes