nicola-framework 1.0.0

package/core/Core.js

@@ -0,0 +1,84 @@
+import http from 'http'
+import Remote from './Remote.js';
+import BlackBox from '../middlewares/BlackBox.js'
+import Shadowgraph from '../middlewares/Shadowgraph.js';
+import Teleforce from '../middlewares/Teleforce.js';
+import EasyCors from '../middlewares/EasyCors.js';
+class Core extends Remote {
+
+    constructor() {
+        super();
+    }
+
+
+
+
+    listen(port, callback) {
+
+        const server = http.createServer((req, res) => {
+            const myURL = new URL(req.url, 'http://' + req.headers.host);
+            const pathURL = myURL.pathname;
+            const urlParams =  Object.fromEntries(myURL.searchParams);
+
+            req.url = pathURL;
+            req.query = urlParams;
+
+            Shadowgraph(req, res, () => {
+                this.__addHelper(res);
+               EasyCors(req, res, () =>{
+                               
+                Teleforce(req, res, () => {
+                    const done = (err) => {
+                        if (!err) {
+                            res.statusCode = 404;
+                            res.end('Not Found')
+                        }
+                        else {
+                            BlackBox.ignite(err, req, res);
+                        }
+                    }
+
+                    let dataString = ''
+                    req.on('data', chunk => {
+                        dataString += chunk;
+
+                    })
+
+                    req.on('end', () => {
+                        try {
+                            if (dataString) {
+                                req.body = JSON.parse(dataString);
+                            }
+                            else {
+                                req.body = {}
+                            }
+                        }
+                        catch (error) {
+                            req.body = {}
+                        }
+                        this.handle(req, res, done);
+
+                    });
+                })
+               })
+            })
+        })
+        server.listen(port, callback);
+    }
+
+    __addHelper(res) {
+        res.json = (data) => {
+            res.setHeader('Content-Type', 'application/json');
+            res.end(JSON.stringify(data));
+        }
+
+        res.send = (data) => {
+            res.setHeader('Content-Type', 'text/plain');
+            res.end(data);
+        }
+    }
+
+
+}
+
+export default Core;

package/core/Remote.js

@@ -0,0 +1,158 @@
+
+class Remote {
+
+    constructor() {
+        this.stack = []
+    }
+
+    __add(method, path, handlers) {
+        const results = this.parsePath(path)
+        const allHandlers = handlers.flat(Infinity);
+        if (allHandlers.length === 1 && allHandlers[0] instanceof Remote) {
+            this.stack.push({
+                method: method.toUpperCase(),
+                path: path,
+                handler: allHandlers[0]
+            })
+            return;
+        }
+
+        const runner = (req, res, routerNext) => {
+            let idx = 0
+            const internalNext = (err) => {
+                if (err) return routerNext(err);
+
+                const fn = allHandlers[idx];
+                idx++;
+                if (!fn) {
+                    return routerNext();
+                }
+
+                try {
+                    fn(req, res, internalNext);
+                }
+                catch (error) {
+                    internalNext(error);
+                }
+            }
+            internalNext();
+        }
+        if (results.regex) {
+            this.stack.push({
+                method: method.toUpperCase(),
+                path: path,
+                regex: results.regex,
+                keys: results.keys,
+                handler: runner
+            })
+        }
+        else {
+            this.stack.push({
+                method: method.toUpperCase(),
+                path: results,
+                handler: runner
+            })
+        }
+    }
+
+    get(path, ...handlers) {
+        this.__add('GET', path, handlers);
+    }
+    post(path, ...handlers) {
+        this.__add('POST', path, handlers);
+    }
+    put(path, ...handlers) {
+        this.__add('PUT', path, handlers);
+    }
+    patch(path, ...handlers) {
+        this.__add('PATCH', path, handlers);
+    }
+    delete(path, ...handlers) {
+        this.__add('DELETE', path, handlers);
+    }
+
+
+    use(path, ...handlers) {
+        if (typeof path == 'function') {
+            this.__add('USE', '/', [path, ...handlers])
+        }
+        else {
+            this.__add('USE', path, handlers);
+        }
+
+    }
+
+    handle(req, res, done) {
+        let index = 0
+        let match = false
+        const next = (err) => {
+            if (err) {
+                return done(err)
+            }
+
+            try {
+                const route = this.stack[index]
+                index++;
+                if (!route) {
+                    return done()
+                }
+                const middleware = route.method === 'USE' && req.url.startsWith(route.path);
+                const rutaCoincidence = route.path === req.url && route.method === req.method;
+                match = route.regex && route.regex.test(req.url) && route.method === req.method;
+                if(match){
+                    if(route.regex){
+                        const valueCatch =  req.url.match(route.regex)
+                        req.params = {}
+                        route.keys.forEach((key, index) => {
+                            req.params[key]= valueCatch[index + 1];
+                        });
+                    }
+                }
+                if (rutaCoincidence || middleware || match) {
+                    if (route.handler instanceof Remote) {
+                        const urlBackup = req.url;
+                        req.url = req.url.slice(route.path.length) || '/'
+                        const done = (err) => {
+                            req.url = urlBackup
+                            next(err)
+                        }
+                        route.handler.handle(req, res, done);
+
+                        console.log('Esto es un sub router')
+                    } else {
+
+                        route.handler(req, res, next);
+                    }
+                }
+                else {
+                    next()
+                }
+            } catch (err) {
+                next(err);
+            }
+        }
+
+
+
+        next()
+    }
+
+    parsePath(path) {
+        if (!path.includes(':')) {
+            return path;
+        }
+        if (path.includes(':')) {
+            const keys = []
+            let pathString = path.replace(/:(\w+)/g, (match, paramName) => {
+                keys.push(paramName);
+
+                return '([^/]+)';
+            })
+
+            const regex = new RegExp(`^${pathString}$`)
+            return { regex, keys };
+        }
+    }
+}
+
+export default Remote;

package/database/Connection.js

@@ -0,0 +1,41 @@
+import Postgres from "./dialects/Postgres.js";
+
+class Connection {
+    static client = null
+
+
+    static async connect() {
+        const DB_DRIVER =  process.env.DB_DRIVER
+        const config = {
+                user: process.env.DB_USER,
+                password: process.env.DB_PASS,
+                host: process.env.DB_HOST,
+                port: process.env.DB_PORT,
+                database: process.env.DB_NAME
+            }
+
+        if(DB_DRIVER === 'postgres'){
+            this.client =  new Postgres(config)
+            await this.client.connect()
+            return;
+        }
+        if(DB_DRIVER === 'mysql'){
+            await this.__connectMysql()
+            return;
+        }
+        throw new Error("Driver no soportado" + DB_DRIVER)
+    }
+
+
+
+    static async __connectMysql(){
+
+    }
+
+    static async query(sql, params){
+        return this.client.query(sql, params);
+    }
+}
+
+
+export default Connection;

package/database/Driver.js

@@ -0,0 +1,38 @@
+class Driver {
+
+
+    constructor(config){
+        this.config = config
+    }
+
+    async connect(){
+        throw new Error("Method 'connect()' must be implemented");
+    }
+
+    async query(sql, params){
+        throw new Error("Method 'query()' must be implemented");
+    }
+
+    async disconnect(){
+throw new Error("Method 'disconnect()' must be implemented");
+    }
+
+     compileSelect(builder){
+        
+    }
+
+    compileInsert(builder, data){
+
+    }
+
+    compileUpdate(builder, data){
+
+    }
+
+    compileDelete(builder){
+        
+    }
+}
+
+
+export default Driver;

package/database/Model.js

@@ -0,0 +1,48 @@
+import QueryBuilder from "./QueryBuilder.js";
+import Schema from "./Schema.js";
+
+class Model {
+    static tableName = null
+    static schema = {}
+    static query(){
+        return new QueryBuilder(this.tableName)
+    }
+
+    static select(...params){
+        return this.query().select(...params);
+    }
+
+    static where(...params){
+        return this.query().where(...params);
+    }
+
+    static all(){
+        return this.query().get();
+    }
+
+    static create(...params){
+        Schema.validate(...params, this.schema)
+        return this.query().insert(...params);
+    }
+
+    static update(...params){
+        return this.query().update(...params);
+    }
+
+    static delete(){
+        return this.query().delete();
+    }
+
+    static orderBy(...params){
+        return this.query().orderby(...params);
+    }
+        static limit(...params){
+        return this.query().limit(...params);
+    }
+        static offset(...params){
+        return this.query().offset(...params);
+    }
+}
+
+
+export default Model;

package/database/QueryBuilder.js

@@ -0,0 +1,96 @@
+import Connection from "./Connection.js";
+
+class QueryBuilder {
+  constructor(db_name) {
+    this.table = db_name;
+    this.columns = ["*"];
+    this.conditions = [];
+    this.bindings = [];
+    this.orders= [];
+    this.limitCount= null;
+    this.offsetCount = null;
+  }
+
+  select(columns) {
+    if (Array.isArray(columns)) {
+      this.columns = columns;
+    }
+    if (typeof columns === "string") {
+      let columnsSplit = columns.split(",");
+      let cleanCols = [];
+      for (const col of columnsSplit) {
+        cleanCols.push(col.trim());
+      }
+      this.columns = cleanCols;
+    }
+    return this;
+  }
+
+  where(column, operator, value) {
+    if (value === undefined) {
+      value = operator;
+      operator = "=";
+    }
+
+    let totalIndex = this.bindings.length + 1;
+
+    this.conditions.push({
+      column: column,
+      operator: operator,
+      bindingsIndex: totalIndex,
+    });
+
+    this.bindings.push(value);
+
+    return this;
+  }
+
+  async get() {
+    const { sql, bindings } = Connection.client.compileSelect(this);
+    const result = await Connection.query(sql, bindings);
+    return result.rows;
+  }
+
+  async insert(data) {
+    const { sql, bindings } = Connection.client.compileInsert(this, data);
+    const result = await Connection.query(sql, bindings);
+    return result.rows[0];
+  }
+
+  async update(data) {
+    const { sql, bindings } = Connection.client.compileUpdate(this, data);
+    const result = await Connection.query(sql, bindings);
+    return result.count;
+  }
+
+  async delete() {
+    const { sql, bindings } = Connection.client.compileDelete(this);
+    const result = await Connection.query(sql, bindings);
+    return result.count;
+  }
+
+  orderBy(column, direction = "ASC"){
+    this.orders.push({
+        column: column,
+        direction: direction.toUpperCase()
+    })
+
+    return this;
+  }
+
+  limit(number){
+    this.limitCount = number
+
+    return this;
+  }
+
+  offset(number){
+    this.offsetCount = number
+
+    return this;
+  }
+
+
+}
+
+export default QueryBuilder;

package/database/Schema.js

@@ -0,0 +1,24 @@
+
+
+class Schema{
+
+
+
+    static validate(data, rules){
+        for(const field in rules){
+            const rule = rules[field]
+            const value = data[field]
+
+            if(rule.required === true && (value === undefined || value === null || value === '')){
+                  throw new Error(`Field ${field} is required`)
+            }
+            if(typeof value !== rule.type && value !== undefined && value !== null){
+                throw new Error(`Field ${field} must be a ${rule.type}`)
+            }
+        };
+
+        return true;
+    }
+}
+
+export default Schema;

package/database/dialects/Postgres.js

@@ -0,0 +1,162 @@
+import Driver from "../Driver.js";
+
+
+class Postgres extends Driver {
+    constructor(config) {
+        super(config);
+        this.client = null
+    }
+
+    async connect() {
+        try {
+            const pg = await import('pg')
+            const { Pool } = pg.default || pg
+
+            const config = {
+                user: this.config.user,
+                password: this.config.password,
+                host: this.config.host,
+                port: this.config.port,
+                database: this.config.database
+            }
+
+            if (process.env.DB_SSLMODE) {
+                const sslMode = process.env.DB_SSLMODE.toLowerCase();
+
+                if (sslMode === 'require') {
+                    config.ssl = { rejectUnauthorized: false };
+                } else if (sslMode === 'verify-ca' || sslMode === 'verify-full') {
+                    config.ssl = { rejectUnauthorized: true };
+                } else if (sslMode === 'disable' || sslMode === 'prefer') {
+                    config.ssl = false;
+                } else {
+                    config.ssl = { rejectUnauthorized: false };
+                }
+            }
+
+            this.client = new Pool(config)
+
+            await this.client.query('SELECT NOW()')
+        }
+        catch (e) {
+            if (e.code === 'ERR_MODULE_NOT_FOUND') {
+                console.log('Por favor utiliza el comando npm install pg')
+            }
+            else {
+                console.error(e)
+            }
+        }
+    }
+
+
+    async query(sql, params) {
+        if (!this.client) {
+            return console.log("Dynamo: No hay ninguna conexion activa")
+        }
+        const result = await this.client.query(sql, params);
+        return {
+            rows: result.rows,
+            count: result.rowCount
+        }
+    }
+
+    compileSelect(builder) {
+        const stringColums = builder.columns.join(', ')
+        let ordersBy = ''  
+        let limit = ''
+        let offset = ''
+        if(builder.orders.length > 0){
+            const OrdesArray = builder.orders.map(o => {
+                return ` ${o.column} ${o.direction}`
+            })
+            ordersBy =' ORDER BY ' + OrdesArray.join(',')
+
+        }
+        if(builder.limitCount !== null){
+            limit = ` LIMIT ${builder.limitCount}`
+        }
+        if(builder.offsetCount !== null){
+            offset = ` OFFSET ${builder.offsetCount}`
+        }
+        const where = this._buildWhere(builder.conditions)
+        const sql = `SELECT ${stringColums} FROM ${builder.table} ${where} ${ordersBy} ${limit}  ${offset}`
+
+        return {
+            sql: sql,
+            bindings: builder.bindings
+        }
+    }
+
+    _buildWhere(conditions) {
+        let whereQuery = ''
+
+        if (conditions.length > 0) {
+            const query = conditions.map(condition => {
+                return ` ${condition.column} ${condition.operator} $${condition.bindingsIndex}`
+            })
+
+            return whereQuery = 'WHERE ' + query.join(' AND ')
+        }
+
+        return whereQuery
+    }
+
+
+    compileInsert(builder, data) {
+        let columns = Object.keys(data);
+        columns = columns.join(', ')
+        let values = Object.values(data)
+        let bindingsIndex = []
+        values.forEach(v => {
+            let index = builder.bindings.length + 1
+            bindingsIndex.push(`$${index}`)
+            builder.bindings.push(v)
+        })
+
+        bindingsIndex = bindingsIndex.join(', ')
+
+        let sql = `INSERT INTO ${builder.table} (${columns}) VALUES (${bindingsIndex}) RETURNING *`
+
+        return {
+            sql: sql,
+            bindings: builder.bindings
+        }
+    }
+
+    compileUpdate(builder, data) {
+        const columns = Object.keys(data)
+        const values = Object.values(data)
+        let stringColums = []
+        let whereQuery = ''
+        let index = 0
+        columns.forEach((c, i) => {
+            index = builder.bindings.length + 1
+            builder.bindings.push(values[i])
+            stringColums.push(`${c} = $${index}`)
+        })
+
+        const where = this._buildWhere(builder.conditions)
+
+        stringColums = stringColums.join(', ')
+
+        const sql = `UPDATE ${builder.table} SET ${stringColums} ${where}`
+
+        return {
+            sql:sql,
+            bindings: builder.bindings
+        }
+    }
+
+    compileDelete(builder) {
+        const where = this._buildWhere(builder.conditions)
+
+        const sql = `DELETE FROM ${builder.table} ${where}`
+        
+        return{
+            sql:sql,
+            bindings: builder.bindings
+        }
+    }
+}
+
+export default Postgres;

package/database/index.js

@@ -0,0 +1,20 @@
+import Model from './Model.js'
+import QueryBuilder from './QueryBuilder.js'
+import Connection from './Connection.js'
+
+class Dynamo{
+    static async connect(){
+        return Connection.connect()
+    }
+
+    static async query(sql, params){
+        return Connection.query(sql, params)
+    }
+
+
+    static Model = Model;
+    static QueryBuilder = QueryBuilder;
+}
+
+
+export default Dynamo;

package/dev-tools/DevRunner.js

@@ -0,0 +1,6 @@
+
+import LiveCurrent from "./LiveCurrent.js";
+
+const Live =  new LiveCurrent('Server.js')
+
+Live.boot()

package/dev-tools/LiveCurrent.js

@@ -0,0 +1,38 @@
+import fs from 'fs/promises'
+import { spawn } from 'child_process'
+import chalk from 'chalk'
+class LiveCurrent{
+    constructor(entryPoint){
+        this.entryPoint = entryPoint;
+        this.process =  null;
+    }
+
+    boot(){
+        this.watch()
+        this.ignite()
+    }
+
+    ignite(){
+        this.process=  spawn('node', [this.entryPoint], {stdio: 'inherit'});
+        console.log(chalk.greenBright(`LiveCurrent: Iniciando Servidor...`));
+    }
+    reload(){
+        if(this.process){
+            this.process.kill()
+            this.ignite()
+        }
+    }
+
+    watch(){
+        fs.watch(process.cwd(), {recursive: true}, (eventType, filename) => {
+            if(filename.includes('node_modules') || filename === ''){
+                return
+            }
+            this.reload()
+        })
+    }
+
+}
+
+
+export default LiveCurrent;

package/index.js

@@ -0,0 +1,31 @@
+/**
+ * Tesla Framework - Main Export
+ * 
+ * Punto de entrada principal del framework
+ */
+
+// Core
+export { default as Tesla } from './core/Core.js';
+export { default as Remote } from './core/Remote.js';
+
+// Middlewares
+export { default as Shadowgraph } from './middlewares/Shadowgraph.js';
+export { default as Teleforce } from './middlewares/Teleforce.js';
+export { default as BlackBox } from './middlewares/BlackBox.js';
+export { default as EasyCors } from './middlewares/EasyCors.js';
+export { default as Insulator } from './middlewares/Insulator.js';
+
+// Security
+export { default as Coherer } from './security/Coherer.js';
+export { default as Regulator } from './security/Regulator.js';
+
+// Dev Tools
+export { default as LiveCurrent } from './dev-tools/LiveCurrent.js';
+export { default as DevRunner } from './dev-tools/DevRunner.js';
+
+// Database (Dynamo ORM)
+export { default as Dynamo } from './database/index.js';
+
+// Default export (Tesla Core)
+import Tesla from './core/Core.js';
+export default Tesla;

package/middlewares/BlackBox.js

@@ -0,0 +1,15 @@
+import { error } from '../templates/error.js'
+class BlackBox{
+    constructor(){
+
+    }
+
+    static ignite(err, req , res){
+        
+        res.writeHead(500, {'Content-Type': 'text/html'})
+        res.end(error(err.message, err.stack))
+    }
+}
+
+
+export default BlackBox;

package/middlewares/EasyCors.js

@@ -0,0 +1,19 @@
+
+
+const EasyCors = (req, res, next) =>{
+    res.setHeader('Access-Control-Allow-Origin','*')
+    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS, PATCH')
+    res.setHeader('Access-Control-Allow-Headers', 'Content-Type, Authorization')
+
+    if(req.method === 'OPTIONS'){
+        res.statusCode = 204
+        res.end()
+        return;
+    }
+    else{
+        next()
+    }
+}
+
+
+export default EasyCors;

package/middlewares/Insulator.js

@@ -0,0 +1,24 @@
+
+const Insulator = (schema) => {
+
+    return (req, res, next) => {
+        for (const key in schema) {
+            const expectedType = schema[key];
+            const value = req.body[key]
+            if (value === undefined) {
+                res.statusCode = 400;
+                res.end(`Falta campo: ${key}`)
+                return;
+            }
+            if (typeof value !== expectedType) {
+                res.statusCode = 400;
+                res.end(`El campo ${key} debe ser ${expectedType}`)
+                return;
+            }
+        }
+        next()
+    }
+}
+
+
+export default Insulator;

package/middlewares/Shadowgraph.js

@@ -0,0 +1,13 @@
+import chalk from 'chalk'
+
+const Shadowgraph = (req, res, next) =>{
+    const inicio = Date.now()
+    res.on('finish', () =>{
+        const duracion = Date.now() - inicio 
+        console.log(chalk.green(`[${req.method}] ${req.url} - ${res.statusCode} ${res.statusMessage} - ${duracion}ms`))
+    })
+    next()
+}
+
+
+export default Shadowgraph;

package/middlewares/Teleforce.js

@@ -0,0 +1,11 @@
+
+
+const Teleforce = (req, res, next) =>{
+    res.removeHeader('X-Powered-By');
+    res.setHeader('X-Content-Type-Options', 'nosniff')
+    res.setHeader('X-Frame-Options', 'Deny')
+    res.setHeader('X-XSS-Protection', '1')
+    next()
+}
+
+export default Teleforce;

package/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "nicola-framework",
+  "version": "1.0.0",
+  "description": "Zero-dependency web framework for Node.js",
+  "type": "module",
+  "main": "index.js",
+  "exports": {
+    ".": "./index.js",
+    "./core": "./core/Core.js",
+    "./router": "./core/Remote.js",
+    "./middlewares/*": "./middlewares/*.js",
+    "./security/*": "./security/*.js",
+    "./database": "./database/index.js"
+  },
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [
+    "framework",
+    "web",
+    "http",
+    "server",
+    "router",
+    "middleware",
+    "zero-dependency",
+    "orm"
+  ],
+  "author": "Your Name",
+  "license": "MIT",
+  "dependencies": {
+    "chalk": "^5.6.2"
+  }
+}

package/security/Coherer.js

@@ -0,0 +1,53 @@
+import crypto from 'crypto'
+import Regulator from './Regulator.js';
+
+class Coherer{
+    constructor(){
+
+    }
+    static SECRET = process.env.TESLA_SECRET || 'tesla_secret_dev_key'
+
+    static codec(jsonData){
+        const dataString = JSON.stringify(jsonData);
+        const buffer =  Buffer.from(dataString);
+        return buffer.toString('base64url')
+    }
+
+    static sign(Payload){
+        const payloadB64 = this.codec(Payload);
+        const header = {
+            alg: 'HS256',
+            typ: 'JWT'
+        }
+        const headerB64 = this.codec(header)
+
+        const data = headerB64 + '.' + payloadB64
+
+        const signature = crypto.createHmac('sha256', this.SECRET)
+                                .update(data)
+                                .digest('base64url')
+
+        return data + '.' + signature
+    }
+    static verify(data){
+       const [headerB64, payloadB64, signature] = data.token.split('.');
+
+        const dataToCheck =  headerB64 + '.' + payloadB64
+
+        const signatureToChecks = crypto.createHmac('sha256', this.SECRET)
+                                .update(dataToCheck)
+                                .digest('base64url')
+
+        if(signature === signatureToChecks){
+            let decodedPayload = Buffer.from(payloadB64, 'base64url').toString('utf-8')
+            decodedPayload = JSON.parse(decodedPayload)
+            return decodedPayload
+        }
+        else{
+            throw new Error('Token Invalido')
+        }
+    }
+}
+
+
+export default Coherer;

package/security/Regulator.js

@@ -0,0 +1,38 @@
+import fs from 'fs'
+import path from 'path'
+
+
+class Regulator{
+
+
+
+    static load(){
+        const CURRENT_DIR = path.join(process.cwd(), ".env")
+
+        if(fs.existsSync(CURRENT_DIR)){
+            const envFile= fs.readFileSync(CURRENT_DIR, 'utf-8');
+            let lineEnv = envFile.split('\n')
+            lineEnv.forEach(line => {
+                let lineClean = line.trim()
+                if(lineClean.length === 0 || lineClean.startsWith('#')){
+                    return;
+                }
+                let index = lineClean.indexOf('=')
+                if(index === -1){
+                    return;
+                }
+
+                let key = lineClean.substring(0, index);
+                let value =  lineClean.substring(index + 1);
+
+                key = key.trim()
+                value = value.trim()
+
+                process.env[key] = value;
+            })
+        }
+
+    }
+}
+
+export default Regulator;

package/templates/error.js

@@ -0,0 +1,36 @@
+
+
+export const error = (message, stack) =>{
+
+   return `
+<html>
+    <head>
+        <style>
+            body {
+                background-color: #111; 
+                color: #fff; 
+                font-family: monospace; 
+                padding: 20px;
+            }
+            h1 { 
+                color: #ff3333; 
+            }
+            pre { 
+                background: #222; 
+                padding: 15px; 
+                border-radius: 5px; 
+                overflow-x: auto; 
+                }
+        </style>
+    </head>
+    <body>
+        <div class = "error-box">
+            <h1> Reporte de Error </h1>
+            <h2>${message}</h2>
+        </div>
+            <h3> Reporte de Error </h3>
+            <pre>${stack}</pre>        
+    </body>
+</html>
+`
+}