indreklasn

// Create a .env file at your project root:

// add your variables:

VITE_API_KEY=your_api_key_here

// Accessing Environment Variables:
// In your Vite project, you can access the environment variable directly:

const apiKey = import.meta.env.VITE_API_KEY;

indreklasn

const express = require('express');
const app = express();
const session = require('express-session');

// Assuming we have a function to get user data
const getUserById = require('./getUserById');

app.use(session({
  secret: 'your-secret',
  resave: false,

indreklasn

<script>
  import { onMount } from 'svelte';
  import axios from 'axios';

  let csrfToken = '';

  onMount(async () => {
    try {
      const response = await axios.get('/api/get-csrf-token');
      csrfToken = response.data.csrfToken;

indreklasn

codeserver {
    # ... other configuration ...

    add_header Content-Security-Policy "script-src 'self' 'unsafe-inline' http://localhost:5173 https://static.cloudflareinsights.com https://www.clarity.ms https://accounts.google.com https://upload-widget.cloudinary.com https://maps.googleapis.com https://www.googletagmanager.com;"

    # ... other configuration ...
}

indreklasn

# CSP Header
header Content-Security-Policy "script-src 'self' 'unsafe-inline' http://localhost:5173 https://static.cloudflareinsights.com https://www.clarity.ms https://accounts.google.com https://upload-widget.cloudinary.com https://maps.googleapis.com https://www.googletagmanager.com;"

indreklasn

import React, { useState } from 'react';
import DOMPurify from 'dompurify';

const UserComments = () => {
  const [comments, setComments] = useState([
    // Assume these comments are fetched from a server
    { id: 1, content: '<script>alert("XSS Attack!")</script>Great article!' },
    { id: 2, content: 'Really enjoyed this post.' },
    // More comments...
  ]);

indreklasn

import React, { useState, useEffect } from "react";

const Planets = () => {
  const [hasError, setErrors] = useState(false);
  const [planets, setPlanets] = useState({});

  async function fetchData() {
    const res = await fetch("https://swapi.co/api/planets/4/");
    res
      .json()

indreklasn

import React, { useState, useEffect } from "react";

const Planets = () => {
  const [hasError, setErrors] = useState(false);
  const [planets, setPlanets] = useState({});

  useEffect(() => {
    async function fetchData() {
      const res = await fetch("https://swapi.co/api/planets/4/");
      res

indreklasn

import React, { useEffect, useState, Fragment } from "react";
import Tabletop from "tabletop";
import "./styles.css";

export default function App() {
  const [data, setData] = useState([]);

  useEffect(() => {
    Tabletop.init({
      key: "1TK1Qj6kfA90KbmFAdnIOtKUttpJUhZoZuOPy925c6nQ",

indreklasn

orbs:
  react: thefrontside/react@0.2.0
version: 2.1
workflows:
  push:
    jobs:
      - react/install
      - react/eslint:
          requires:
            - react/install