\documentclass[10pt,a4paper]{article}

% Packages
\usepackage{fancyhdr}           % For header and footer
\usepackage{multicol}           % Allows multicols in tables
\usepackage{tabularx}           % Intelligent column widths
\usepackage{tabulary}           % Used in header and footer
\usepackage{hhline}             % Border under tables
\usepackage{graphicx}           % For images
\usepackage{xcolor}             % For hex colours
%\usepackage[utf8x]{inputenc}    % For unicode character support
\usepackage[T1]{fontenc}        % Without this we get weird character replacements
\usepackage{colortbl}           % For coloured tables
\usepackage{setspace}           % For line height
\usepackage{lastpage}           % Needed for total page number
\usepackage{seqsplit}           % Splits long words.
%\usepackage{opensans}          % Can't make this work so far. Shame. Would be lovely.
\usepackage[normalem]{ulem}     % For underlining links
% Most of the following are not required for the majority
% of cheat sheets but are needed for some symbol support.
\usepackage{amsmath}            % Symbols
\usepackage{MnSymbol}           % Symbols
\usepackage{wasysym}            % Symbols
%\usepackage[english,german,french,spanish,italian]{babel}              % Languages

% Document Info
\author{sally sung}
\pdfinfo{
  /Title (full-stack-dev-with-js-quiz2.pdf)
  /Creator (Cheatography)
  /Author (sally sung)
  /Subject (Full Stack Dev With JS - Quiz2 Cheat Sheet)
}

% Lengths and widths
\addtolength{\textwidth}{6cm}
\addtolength{\textheight}{-1cm}
\addtolength{\hoffset}{-3cm}
\addtolength{\voffset}{-2cm}
\setlength{\tabcolsep}{0.2cm} % Space between columns
\setlength{\headsep}{-12pt} % Reduce space between header and content
\setlength{\headheight}{85pt} % If less, LaTeX automatically increases it
\renewcommand{\footrulewidth}{0pt} % Remove footer line
\renewcommand{\headrulewidth}{0pt} % Remove header line
\renewcommand{\seqinsert}{\ifmmode\allowbreak\else\-\fi} % Hyphens in seqsplit
% This two commands together give roughly
% the right line height in the tables
\renewcommand{\arraystretch}{1.3}
\onehalfspacing

% Commands
\newcommand{\SetRowColor}[1]{\noalign{\gdef\RowColorName{#1}}\rowcolor{\RowColorName}} % Shortcut for row colour
\newcommand{\mymulticolumn}[3]{\multicolumn{#1}{>{\columncolor{\RowColorName}}#2}{#3}} % For coloured multi-cols
\newcolumntype{x}[1]{>{\raggedright}p{#1}} % New column types for ragged-right paragraph columns
\newcommand{\tn}{\tabularnewline} % Required as custom column type in use

% Font and Colours
\definecolor{HeadBackground}{HTML}{333333}
\definecolor{FootBackground}{HTML}{666666}
\definecolor{TextColor}{HTML}{333333}
\definecolor{DarkBackground}{HTML}{FF8F8F}
\definecolor{LightBackground}{HTML}{FFF1F1}
\renewcommand{\familydefault}{\sfdefault}
\color{TextColor}

% Header and Footer
\pagestyle{fancy}
\fancyhead{} % Set header to blank
\fancyfoot{} % Set footer to blank
\fancyhead[L]{
\noindent
\begin{multicols}{3}
\begin{tabulary}{5.8cm}{C}
    \SetRowColor{DarkBackground}
    \vspace{-7pt}
    {\parbox{\dimexpr\textwidth-2\fboxsep\relax}{\noindent
        \hspace*{-6pt}\includegraphics[width=5.8cm]{/web/www.cheatography.com/public/images/cheatography_logo.pdf}}
    }
\end{tabulary}
\columnbreak
\begin{tabulary}{11cm}{L}
    \vspace{-2pt}\large{\bf{\textcolor{DarkBackground}{\textrm{Full Stack Dev With JS - Quiz2 Cheat Sheet}}}} \\
    \normalsize{by \textcolor{DarkBackground}{sally sung} via \textcolor{DarkBackground}{\uline{cheatography.com/216190/cs/47889/}}}
\end{tabulary}
\end{multicols}}

\fancyfoot[L]{ \footnotesize
\noindent
\begin{multicols}{3}
\begin{tabulary}{5.8cm}{LL}
  \SetRowColor{FootBackground}
  \mymulticolumn{2}{p{5.377cm}}{\bf\textcolor{white}{Cheatographer}}  \\
  \vspace{-2pt}sally sung \\
  \uline{cheatography.com/sally-sung} \\
  \end{tabulary}
\vfill
\columnbreak
\begin{tabulary}{5.8cm}{L}
  \SetRowColor{FootBackground}
  \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Cheat Sheet}}  \\
   \vspace{-2pt}Not Yet Published.\\
   Updated 25th March, 2026.\\
   Page {\thepage} of \pageref{LastPage}.
\end{tabulary}
\vfill
\columnbreak
\begin{tabulary}{5.8cm}{L}
  \SetRowColor{FootBackground}
  \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Sponsor}}  \\
  \SetRowColor{white}
  \vspace{-5pt}
  %\includegraphics[width=48px,height=48px]{dave.jpeg}
  Measure your website readability!\\
  www.readability-score.com
\end{tabulary}
\end{multicols}}




\begin{document}
\raggedright
\raggedcolumns

% Set font size to small. Switch to any value
% from this page to resize cheat sheet text:
% www.emerson.emory.edu/services/latex/latex_169.html
\footnotesize % Small font.

\begin{multicols*}{2}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Using fs module}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{import fs from "fs" \newline  \newline fs.copyFile("file1.txt", "file2.txt",(err)=\textgreater{}\{ \newline     if(err) console.log(`Error happened \$\{err\}`) \newline     else console.log("Copied Successfully.") \newline \}) \newline  \newline fs.wrtieFile("message.txt", "Hello from Node Js!", (err) =\textgreater{} \{ \newline 		if(err) console.log(`Error happened \$\{err\}`) \newline     else console.log("The file has been saved.")  \newline \}); \newline  \newline fs.readFile("message.txt", "utf-8", (err, data) =\textgreater{} \{ \newline 		if(err) throw err; \newline     else console.log(data); \newline \});} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{node.js project initial setting}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{create folder (ex. intro\_to\_node) \newline  \newline npm init -y \textgreater{}\textgreater{} package.json created  \newline npm i express nodemon  \newline  \newline at package.json \newline "type": "module", \newline "main": "server.js", \newline "scripts": \{ \newline 	..., \newline   "start": "nodemon server.js" \newline \} \newline  \newline create server.js file} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Node/Express Server}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{import express from "express" \newline const app = express(); \newline const PORT = 3000; \newline  \newline app.listen(PORT,()=\textgreater{}\{ \newline     console.log(`The server is up and running on port \$\{PORT\}`) \newline \})} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{REST API}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{app.use(express.urlencoded(\{extended:true\})) \newline  \newline //GET -{}- root route \newline app.get("/",(req,res)=\textgreater{}\{ \newline     // \seqsplit{console.log(req.rawHeaders)} \newline     res.send(`\textless{}h1\textgreater{}Hello \textless{}/h1\textgreater{}`); \newline \}) \newline //GET -{}- about route \newline app.get("/about",(req,res)=\textgreater{}\{ \newline     // \seqsplit{console.log(req.rawHeaders)} \newline     res.json(\{"Name":"Anu", "Title":"Instructor"\}); \newline \}) \newline //POST \newline app.post("/", (req,res)=\textgreater{}\{ \newline     res.sendStatus(201) \newline \}) \newline //PUT \newline app.put("/", (req,res)=\textgreater{}\{ \newline     res.send("Updated \seqsplit{Successfully").sendStatus(200);} \newline \}) \newline //DELETE \newline app.delete("/", (req,res)=\textgreater{}\{ \newline     res.send("Deleted \seqsplit{Successfully").sendStatus(200);} \newline \})} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Ejs (Backend)}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{npm i ejs  \newline  \newline import path from 'path'; \newline import \{fileURLToPath \} from 'url'; \newline const \_\_filename = \seqsplit{fileURLToPath(import.meta.url);} \newline const \_\_dirname = \seqsplit{path.dirname(\_\_filename);} \newline  \newline  //ejs \newline app.set("view engine", "ejs"); \newline app.set("views", path.join(\_\_dirname, "views")); \newline  \newline //POST \newline app.post("/",(req,res)=\textgreater{}\{ \newline     let \{num1,num2\}=req.body; \newline     let sum = parseInt(num1) + parseInt(num2); \newline     res.render("index",\{data:sum, err:"There is an error."\}) \newline \})} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Ejs (Frontend)}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{\textless{}!DOCTYPE html\textgreater{} \newline \textless{}html lang="en"\textgreater{} \newline  \newline \textless{}head\textgreater{} \newline   \textless{}meta charset="utf-8"\textgreater{} \newline   \textless{}title\textgreater{}Calculator\textless{}/title\textgreater{} \newline \textless{}/head\textgreater{} \newline  \newline \textless{}body\textgreater{} \newline   \textless{}h1\textgreater{}Calculator\textless{}/h1\textgreater{} \newline   \textless{}!-{}- action - URL or filename or path of server side processing script -{}-\textgreater{} \newline   \textless{}!-{}- action - it indicates where to send the form information when the form is submitted -{}-\textgreater{} \newline   \textless{}!-{}- \textless{}method - post - transmits the form data in the body of the http request -{}-\textgreater{} \newline   \textless{}form action="/" method="post"\textgreater{} \newline     \textless{}label for="num1"\textgreater{}Enter first number:\textless{}/label\textgreater{} \newline     \textless{}input type="number" name="num1" id="num1" placeholder="First Number"\textgreater{} \textless{}br\textgreater{}\textless{}br\textgreater{} \newline     \textless{}label for="num2"\textgreater{}Enter second number:\textless{}/label\textgreater{} \newline     \textless{}input type="number" name="num2" id="num2" placeholder="Second Number"\textgreater{} \textless{}br\textgreater{}\textless{}br\textgreater{} \newline     \textless{}!-{}- \textless{}button type="submit" name="submit"\textgreater{}Calculate\textless{}/button\textgreater{} -{}-\textgreater{} \newline     \textless{}button\textgreater{}Calculate\textless{}/button\textgreater{} \newline   \textless{}/form\textgreater{} \newline  \newline   \textless{}div \textless{}\% if(locals.data) \{\%\textgreater{}\textgreater{} \newline     \textless{}h3\textgreater{}The sum is \textless{}\%= data  \%\textgreater{}\textless{}/h3\textgreater{} \newline     \textless{}\% \} \%\textgreater{} \newline   \textless{}/div\textgreater{}  \newline   \newline \textless{}/body\textgreater{} \newline  \newline \textless{}/html\textgreater{}} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Axios}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{import axios from "axios" \newline  \newline app.post("/",async (req,res)=\textgreater{}\{ \newline     const \{category,difficulty\} = req.body; \newline     const URL = \seqsplit{`https://opentdb.com/api.php}?amount=1\&category=\$\{category\}\&difficulty=\$\{difficulty\}\&type=boolean`; \newline     try\{ \newline         const \{data\} = await axios.get(URL); \newline         res.render("index",\{resObj:data.results{[}0{]}\}) \newline     \} \newline     catch(err)\{ \newline         console.log(`The error is \$\{err.message\}`); \newline         res.render("index", \{error\_db: err.message\}) \newline     \} \newline \})} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Fetch}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{//GET \newline app.get("/",async (req,res)=\textgreater{}\{ \newline     const URL = \seqsplit{`https://catfact.ninja/fact`;} \newline     try\{ \newline 		    //using fetch \newline         const response = await fetch(URL); \newline         const data = await response.json(); \newline         res.render("index", \{data: data\}) \newline     \} \newline     catch(err)\{ \newline         console.log(`The error is \$\{err.message\}`); \newline         res.render("index", \{error: err.message\}) \newline     \} \newline \})} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}


% That's all folks
\end{multicols*}

\end{document}