Noveller

mkdir -p /usr/local/etc/nginx/sites-{enabled,available}
cd /usr/local/etc/nginx/sites-enabled
ln -s ../sites-available/default.conf
ln -s ../sites-available/default-ssl.conf

File locations:

• nginx.conf to /usr/local/etc/nginx/
• default.conf and default-ssl.conf to /usr/local/etc/nginx/sites-available
• homebrew.mxcl.nginx.plist to /Library/LaunchDaemons/

Noveller

Project root:

yarn add -D --save-exact eslint-config-airbnb eslint-config-airbnb-typescript eslint-config-prettier eslint-config-react-app eslint-import-resolver-typescript eslint-webpack-plugin eslint-plugin-flowtype eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react eslint-plugin-react-hooks babel-eslint eslint-plugin-jest @typescript-eslint/parser @typescript-eslint/eslint-plugin prettier prettier-eslint prettier-eslint-cli eslint-plugin-prettier

$ vim .eslintrc

{
  "plugins": ["prettier", "@typescript-eslint"],

Noveller

import React, { useState, useCallback } from 'react';
import { Avatar, Button, Upload } from 'antd';
import { DownloadOutlined, UserOutlined } from '@ant-design/icons';
import { fileToBase64 } from "../../utils";

interface Props {
  label: string,
  buttonText: string,
  action: string,
  avatarIcon?: React.ReactElement,

Noveller

#Fixing “WARNING: UNPROTECTED PRIVATE KEY FILE!” on Linux

If you are getting this error then you probably reset the permissions on your hidden .ssh directory in your user folder, and your keys aren’t going to work anymore. It’s very important that these files not be writable by just anybody with a login to the box, so openssh will give you an error if you try to use them.

The full error message:

@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
@         WARNING: UNPROTECTED PRIVATE KEY FILE!          @
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@

Noveller

/*
Demo: https://jsfiddle.net/elky/f6khaf2t/

<div class="element">
  <div class="truncate">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt
    ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
    laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
    voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
    non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Noveller

Webpack & Tailwind CSS Setup

Create your package.json

npm init -y

Create your src folder

Create a folder called src and add an empty index.js file. The code that webpack compiles goes in here including any Javascript modules and the main Tailwind file.

Noveller

/*
  This javascript script defines a utility function named generatePages,
  which is intended for use in a project structure with nested page directories. 
  The function generates an index file for dynamic imports using the Loadable Component library. 
  It scans the specified base directory, identifies folders containing pages, 
  and creates dynamic import statements for each page. The resulting statements are written to an output file, 
  consolidating page exports for efficient code splitting and loading. 
  Dependencies include the 'fs' and 'path' modules for file operations, 
  and the '@loadable/component' library for dynamic imports.
*/

Noveller

import { z } from 'zod'

function safeParseJSON ( string: string ): any {
    try { return JSON.parse( string ) }
    catch { return string }
}

function searchParamsToValues ( searchParams: URLSearchParams ): Record<string, any> {
    return Array.from( searchParams.keys() ).reduce( ( record, key ) => {
        const values = searchParams.getAll( key ).map( safeParseJSON )