cheveguerra/bot-whatsapp
1
0
Fork 0
mirror of https://github.com/cheveguerra/bot-whatsapp.git synced 2026-04-19 03:59:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'codigoencasa:main' into patch-1

Browse Source
This commit is contained in:
Jose Alberto Guerra Ugalde
2023-01-06 07:02:55 -06:00
committed by GitHub
parent 8331c23494 cb0d0be786
commit fce765650d
155 changed files with 11399 additions and 1829 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
packages/docs/.gitignore vendored
View File

@@ -41,3 +41,6 @@ package-lock.json
# Cloudflare
functions/**/*.js
# Netlify
.netlify

69
packages/docs/README.md
View File

@@ -285,3 +285,72 @@ By default, the Cloudflare pages adaptor _does not_ include a `public/_routes.js
In the above example, it's saying _all_ pages should be SSR'd. However, the root static files such as `/favicon.ico` and any static assets in `/build/*` should be excluded from the Functions, and instead treated as a static file.
In most cases the generated `dist/_routes.json` file is ideal. However, if you need more granular control over each path, you can instead provide you're own `public/_routes.json` file. When the project provides its own `public/_routes.json` file, then the Cloudflare adaptor will not auto-generate the routes config and instead use the committed one within the `public` directory.
## Express Server
This app has a minimal [Express server](https://expressjs.com/) implementation. After running a full build, you can preview the build using the command:
```
npm run serve
```
Then visit [http://localhost:8080/](http://localhost:8080/)
## Netlify
This starter site is configured to deploy to [Netlify Edge Functions](https://docs.netlify.com/edge-functions/overview/), which means it will be rendered at an edge location near to your users.
### Local development
The [Netlify CLI](https://docs.netlify.com/cli/get-started/) can be used to preview a production build locally. To do so: First build your site, then to start a local server, run:
1. Install Netlify CLI globally `npm i -g netlify-cli`.
2. Build your site with both ssr and static `npm run build`.
3. Start a local server with `npm run serve`.
In this project, `npm run serve` uses the `netlify dev` command to spin up a server that can handle Netlify's Edge Functions locally.
4. Visit [http://localhost:8888/](http://localhost:8888/) to check out your site.
### Edge Functions Declarations
[Netlify Edge Functions declarations](https://docs.netlify.com/edge-functions/declarations/)
can be configured to run on specific URL patterns. Each edge function declaration associates
one site path pattern with one function to execute on requests that match the path. A single request can execute a chain of edge functions from a series of declarations. A single edge function can be associated with multiple paths across various declarations.
This is useful to determine if a page response should be Server-Side Rendered (SSR) or
if the response should use a static-site generated (SSG) `index.html` file instead.
By default, the Netlify Edge adaptor will generate a `.netlify/edge-middleware/manifest.json` file, which is used by the Netlify deployment to determine which paths should, and should not, use edge functions.
To override the generated manifest, you can [add a declaration](https://docs.netlify.com/edge-functions/declarations/#add-a-declaration) to the `netlify.toml` using the `[[edge_functions]]` config. For example:
```toml
[[edge_functions]]
path = "/admin"
function = "auth"
```
### Deployments
You can [deploy your site to Netlify](https://docs.netlify.com/site-deploys/create-deploys/) either via a Git provider integration or through the Netlify CLI. This starter site includes a `netlify.toml` file to configure your build for deployment.
#### Deploying via Git
Once your site has been pushed to your Git provider, you can either link it [in the Netlify UI](https://app.netlify.com/start) or use the CLI. To link your site to a Git provider from the Netlify CLI, run the command:
```shell
netlify link
```
This sets up [continuous deployment](https://docs.netlify.com/site-deploys/create-deploys/#deploy-with-git) for your site's repo. Whenever you push new commits to your repo, Netlify starts the build process..
#### Deploying manually via the CLI
If you wish to deploy from the CLI rather than using Git, you can use the command:
```shell
netlify deploy --build
```
You must use the `--build` flag whenever you deploy. This ensures that the Edge Functions that this starter site relies on are generated and available when you deploy your site.
Add `--prod` flag to deploy to production.

7
packages/docs/adaptors/cloudflare-pages/vite.config.ts → packages/docs/adaptors/netlify-edge/vite.config.ts
View File

@@ -1,4 +1,4 @@
import { cloudflarePagesAdaptor } from '@builder.io/qwik-city/adaptors/cloudflare-pages/vite'
import { netifyEdgeAdaptor } from '@builder.io/qwik-city/adaptors/netlify-edge/vite'
import { extendConfig } from '@builder.io/qwik-city/vite'
import baseConfig from '../../vite.config'
@@ -7,11 +7,12 @@ export default extendConfig(baseConfig, () => {
build: {
ssr: true,
rollupOptions: {
input: ['src/entry.cloudflare-pages.tsx', '@qwik-city-plan'],
input: ['src/entry.netlify-edge.tsx', '@qwik-city-plan'],
},
outDir: '.netlify/edge-functions/entry.netlify-edge',
},
plugins: [
cloudflarePagesAdaptor({
netifyEdgeAdaptor({
staticGenerate: true,
}),
],

12
packages/docs/netlify.toml
View File

@@ -1,7 +1,7 @@
[build]
publish = "dist"
command = "npm run build"
[[headers]]
for = "/build/*"
[headers.values]
Cache-Control = "public, max-age=31536000, immutable"
publish = "dist"
command = "npm run build"
[[edge_functions]]
path = "/*"
function = "entry.netlify-edge"

16
packages/docs/package.json
View File

@@ -6,9 +6,9 @@
"build": "qwik build && npm run subfont",
"build.client": "vite build",
"build.preview": "vite build --ssr src/entry.preview.tsx",
"build.server": "vite build -c adaptors/cloudflare-pages/vite.config.ts",
"build.server": "vite build -c adaptors/netlify-edge/vite.config.ts",
"build.types": "tsc --incremental --noEmit",
"deploy": "wrangler pages dev ./dist",
"deploy": "netlify deploy --prod",
"dev": "vite --host --mode ssr",
"dev.debug": "node --inspect-brk ./node_modules/vite/bin/vite.js --mode ssr --force",
"fmt": "prettier --write .",
@@ -20,7 +20,7 @@
"qwik": "qwik"
},
"devDependencies": {
"@builder.io/qwik": "0.15.0",
"@builder.io/qwik": "0.16.1",
"@builder.io/qwik-city": "0.0.128",
"@fontsource/inter": "^4.5.14",
"@iconify-json/tabler": "^1.1.49",
@@ -28,15 +28,18 @@
"@tailwindcss/forms": "^0.5.3",
"@tailwindcss/line-clamp": "^0.3.1",
"@tailwindcss/typography": "^0.5.0",
"@types/compression": "^1.7.2",
"@types/eslint": "8.4.10",
"@types/node": "latest",
"@typescript-eslint/eslint-plugin": "5.45.0",
"@typescript-eslint/parser": "5.45.0",
"autoprefixer": "10.4.13",
"compression": "^1.7.4",
"eslint": "8.29.0",
"eslint-plugin-qwik": "0.15.0",
"imagetools-core": "^3.2.3",
"node-fetch": "3.3.0",
"netlify-cli": "^12.0.11",
"node-fetch": "^3.3.0",
"postcss": "^8.4.19",
"prettier": "2.8.0",
"rehype-autolink-headings": "^6.1.1",
@@ -45,10 +48,9 @@
"typescript": "4.8.4",
"vite": "3.2.4",
"vite-imagetools": "^4.0.11",
"vite-tsconfig-paths": "3.6.0",
"wrangler": "latest"
"vite-tsconfig-paths": "3.6.0"
},
"engines": {
"node": ">=15.0.0"
"node": ">=17.0.0"
}
}

2
packages/docs/public/_headers
View File

@@ -1,4 +1,2 @@
# https://developers.cloudflare.com/pages/platform/headers/
/build/*
Cache-Control: public, max-age=31536000, s-maxage=31536000, immutable

BIN
packages/docs/src/assets/images/full-logo-light.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 173 KiB

5
packages/docs/src/assets/styles/fonts.css
View File

@@ -5,6 +5,7 @@
font-style: normal;
font-named-instance: 'Regular';
src: url('../fonts/Inter-roman-latin.var.woff2') format('woff2');
font-display: swap;
}
@font-face {
@@ -14,6 +15,7 @@
font-style: italic;
font-named-instance: 'Italic';
src: url('../fonts/Inter-italic-latin.var.woff2') format('woff2');
font-display: swap;
}
@font-face {
@@ -22,6 +24,7 @@
font-style: normal;
src: url('../fonts/FiraCode-VF.woff2') format('woff2-variations'),
url('../fonts/FiraCode-VF.woff') format('woff-variations');
font-display: swap;
}
.font-mono {
@@ -34,6 +37,7 @@
font-weight: 400;
font-display: swap;
src: url('../fonts/SourceSansPro-Regular.otf') format('opentype');
font-display: swap;
}
@font-face {
@@ -41,4 +45,5 @@
font-weight: 700;
font-style: normal;
src: url('../fonts/Ubuntu-Mono-bold.woff2') format('woff2');
font-display: swap;
}

7
packages/docs/src/assets/styles/global.css
View File

@@ -39,6 +39,10 @@
@apply text-xs font-mono bg-stone-100 dark:bg-slate-600 dark:text-white text-red-500 p-1 rounded;
}
.slote video {
@apply rounded drop-shadow-xl w-full md:w-full max-w-screen-md;
}
.slot pre {
@apply w-full flex my-2;
}
@@ -47,6 +51,9 @@
@apply p-3 rounded md:w-full max-w-screen-md overflow-x-auto w-fit bg-gray-800 dark:bg-slate-800 ease-in duration-75 text-gray-100 text-xs shadow-xl;
}
.slot iframe {
@apply rounded ease-in duration-75 text-gray-100 text-xs shadow-xl;
}
.slot a {
@apply text-sky-900 font-medium dark:text-sky-400 dark:hover:text-white;
}

17
packages/docs/src/components/atoms/Netlify.tsx Normal file
View File

@@ -0,0 +1,17 @@
export const Netlify = () => (
<svg
xmlns="http://www.w3.org/2000/svg"
width={147}
height={40}
role="img"
fill="currentColor"
>
<g fill-rule="evenodd">
<path d="M53.37 12.978l.123 2.198c1.403-1.7 3.245-2.55 5.525-2.55 3.951 0 5.962 2.268 6.032 6.804v12.568H60.79V19.676c0-1.207-.26-2.1-.78-2.681-.52-.58-1.371-.87-2.552-.87-1.719 0-3 .78-3.84 2.338v13.535h-4.262v-19.02h4.016zM77.748 32.35c-2.7 0-4.89-.852-6.567-2.557-1.678-1.705-2.517-3.976-2.517-6.812v-.527c0-1.898.365-3.595 1.096-5.089.73-1.494 1.757-2.657 3.078-3.49 1.321-.831 2.794-1.247 4.42-1.247 2.583 0 4.58.826 5.988 2.478 1.41 1.653 2.114 3.99 2.114 7.014v1.723h-12.4c.13 1.57.652 2.812 1.57 3.726.918.914 2.073 1.371 3.464 1.371 1.952 0 3.542-.79 4.77-2.373l2.297 2.198c-.76 1.136-1.774 2.018-3.042 2.645-1.269.627-2.692.94-4.27.94zm-.508-16.294c-1.17 0-2.113.41-2.832 1.23-.72.82-1.178 1.963-1.377 3.428h8.12v-.317c-.094-1.43-.474-2.51-1.14-3.243-.667-.732-1.59-1.098-2.771-1.098zm16.765-7.7v4.623h3.35v3.164h-3.35V26.76c0 .726.144 1.25.43 1.573.286.322.798.483 1.535.483a6.55 6.55 0 0 0 1.49-.176v3.305c-.97.27-1.905.404-2.806.404-3.273 0-4.91-1.81-4.91-5.431V16.142H86.62v-3.164h3.122V8.355h4.261zm11.137 23.643h-4.262v-27h4.262v27zm9.172 0h-4.262v-19.02h4.262v19.02zm-4.525-23.96c0-.655.207-1.2.622-1.634.416-.433 1.009-.65 1.78-.65.772 0 1.368.217 1.79.65.42.434.63.979.63 1.635 0 .644-.21 1.18-.63 1.608-.422.428-1.018.642-1.79.642-.771 0-1.364-.214-1.78-.642-.415-.427-.622-.964-.622-1.608zm10.663 23.96V16.142h-2.894v-3.164h2.894v-1.74c0-2.11.584-3.738 1.753-4.887 1.17-1.148 2.806-1.722 4.91-1.722.749 0 1.544.105 2.386.316l-.105 3.34a8.375 8.375 0 0 0-1.631-.14c-2.035 0-3.052 1.048-3.052 3.146v1.687h3.858v3.164h-3.858v15.856h-4.261zm17.87-6.117l3.858-12.903h4.542l-7.54 21.903c-1.158 3.199-3.122 4.799-5.893 4.799-.62 0-1.304-.106-2.052-.317v-3.305l.807.053c1.075 0 1.885-.196 2.429-.589.543-.392.973-1.051 1.289-1.977l.613-1.635-6.664-18.932h4.595l4.016 12.903z" />
<path
fill-rule="nonzero"
d="M27.887 14.135l-.014-.006c-.008-.003-.016-.006-.023-.013a.11.11 0 0 1-.028-.093l.773-4.726 3.625 3.626-3.77 1.604a.083.083 0 0 1-.033.006h-.015c-.005-.003-.01-.007-.02-.017a1.716 1.716 0 0 0-.495-.381zm5.258-.288l3.876 3.876c.805.806 1.208 1.208 1.355 1.674.022.069.04.138.054.209l-9.263-3.923a.728.728 0 0 0-.015-.006c-.037-.015-.08-.032-.08-.07 0-.038.044-.056.081-.071l.012-.005 3.98-1.684zm5.127 7.003c-.2.376-.59.766-1.25 1.427l-4.37 4.369L27 25.469l-.03-.006c-.05-.008-.103-.017-.103-.062a1.706 1.706 0 0 0-.655-1.193c-.023-.023-.017-.059-.01-.092 0-.005 0-.01.002-.014l1.063-6.526.004-.022c.006-.05.015-.108.06-.108a1.73 1.73 0 0 0 1.16-.665c.009-.01.015-.021.027-.027.032-.015.07 0 .103.014l9.65 4.082zm-6.625 6.801l-7.186 7.186 1.23-7.56.002-.01c.001-.01.003-.02.006-.029.01-.024.036-.034.061-.044l.012-.005a1.85 1.85 0 0 0 .695-.517c.024-.028.053-.055.09-.06a.09.09 0 0 1 .029 0l5.06 1.04zm-8.707 8.707l-.81.81-8.955-12.942a.424.424 0 0 0-.01-.014c-.014-.019-.029-.038-.026-.06 0-.016.011-.03.022-.042l.01-.013c.027-.04.05-.08.075-.123l.02-.035.003-.003c.014-.024.027-.047.051-.06.021-.01.05-.006.073-.001l9.921 2.046a.164.164 0 0 1 .076.033c.013.013.016.027.019.043a1.757 1.757 0 0 0 1.028 1.175c.028.014.016.045.003.078a.238.238 0 0 0-.015.045c-.125.76-1.197 7.298-1.485 9.063zm-1.692 1.691c-.597.591-.949.904-1.347 1.03a2 2 0 0 1-1.206 0c-.466-.148-.869-.55-1.674-1.356L8.028 28.73l2.349-3.643c.011-.018.022-.034.04-.047.025-.018.061-.01.091 0a2.434 2.434 0 0 0 1.638-.083c.027-.01.054-.017.075.002a.19.19 0 0 1 .028.032l8.999 13.058zM7.16 27.863L5.098 25.8l4.074-1.738a.084.084 0 0 1 .033-.007c.034 0 .054.034.072.065a2.91 2.91 0 0 0 .13.184l.013.016c.012.017.004.034-.008.05l-2.25 3.493zm-2.976-2.976l-2.61-2.61c-.444-.444-.766-.766-.99-1.043l7.936 1.646a.84.84 0 0 0 .03.005c.049.008.103.017.103.063 0 .05-.059.073-.109.092l-.023.01-4.337 1.837zM.13 19.892a2 2 0 0 1 .09-.495c.148-.466.55-.868 1.356-1.674l3.34-3.34a2175.525 2175.525 0 0 0 4.626 6.687c.027.036.057.076.026.106-.146.161-.292.337-.395.528a.16.16 0 0 1-.05.062c-.013.008-.027.005-.042.002h-.002L.129 19.891zm5.68-6.403l4.49-4.491c.423.185 1.96.834 3.333 1.414 1.04.44 1.988.84 2.286.97.03.012.057.024.07.054.008.018.004.041 0 .06a2.003 2.003 0 0 0 .523 1.828c.03.03 0 .073-.026.11l-.014.021-4.56 7.063c-.012.02-.023.037-.043.05-.024.015-.058.008-.086.001a2.274 2.274 0 0 0-.543-.074c-.164 0-.342.03-.522.063h-.001c-.02.003-.038.007-.054-.005a.21.21 0 0 1-.045-.051l-4.808-7.013zm5.398-5.398l5.814-5.814c.805-.805 1.208-1.208 1.674-1.355a2 2 0 0 1 1.206 0c.466.147.869.55 1.674 1.355l1.26 1.26L18.7 9.94a.155.155 0 0 1-.041.048c-.025.017-.06.01-.09 0a2.097 2.097 0 0 0-1.92.37c-.027.028-.067.012-.101-.003-.54-.235-4.74-2.01-5.341-2.265zm12.506-3.676l3.818 3.818-.92 5.698v.015a.135.135 0 0 1-.008.038c-.01.02-.03.024-.05.03a1.83 1.83 0 0 0-.548.273.154.154 0 0 0-.02.017c-.011.012-.022.023-.04.025a.114.114 0 0 1-.043-.007l-5.818-2.472-.011-.005c-.037-.015-.081-.033-.081-.071a2.198 2.198 0 0 0-.31-.915c-.028-.046-.059-.094-.035-.141l4.066-6.303zM19.78 13.02l5.454 2.31c.03.014.063.027.076.058a.106.106 0 0 1 0 .057c-.016.08-.03.171-.03.263v.153c0 .038-.039.054-.075.069l-.011.004c-.864.369-12.13 5.173-12.147 5.173-.017 0-.035 0-.052-.017-.03-.03 0-.072.027-.11a.76.76 0 0 0 .014-.02l4.482-6.94.008-.012c.026-.042.056-.089.104-.089l.045.007c.102.014.192.027.283.027.68 0 1.31-.331 1.69-.897a.16.16 0 0 1 .034-.04c.027-.02.067-.01.098.004zm-6.246 9.185l12.28-5.237s.018 0 .035.017c.067.067.124.112.179.154l.027.017c.025.014.05.03.052.056 0 .01 0 .016-.002.025L25.054 23.7l-.004.026c-.007.05-.014.107-.061.107a1.729 1.729 0 0 0-1.373.847l-.005.008c-.014.023-.027.045-.05.057-.021.01-.048.006-.07.001l-9.793-2.02c-.01-.002-.152-.519-.163-.52z"
/>
</g>
</svg>
)

27
packages/docs/src/components/atoms/Qwik.tsx Normal file
View File

@@ -0,0 +1,27 @@
export const Qwik = () => (
<svg
xmlns="http://www.w3.org/2000/svg"
width="147"
height="40"
role="img"
fill="currentColor"
viewBox="0 0 649 201"
>
<path
fill="#18B6F6"
d="m153.3 186.54-29.35-29.2-.42.07v-.3L61.12 95.37l15.41-14.85-9.06-51.93-42.89 53.2c-7.28 7.36-8.68 19.39-3.4 28.21l26.8 44.49c4.1 6.82 10.54 11.2 19.53 10.88 19.03-.67 27.4-.67 27.4-.67l58.37 21.81.02.02Z"
/>
<path
fill="#AC7EF4"
d="M167.8 104.72c4.23-8.72 5.74-16.35 1.57-24l-5.93-10.92-3.08-5.6-1.2-2.2-.1.14-16.15-28A22.57 22.57 0 0 0 123.1 22.8l-14.16.4-42.25.11A22.66 22.66 0 0 0 47.31 34.5L21.64 85.48l45.94-57.15 60.27 66.27-10.8 10.93 6.45 51.84.09-.1v.14h-.1l.14.13 5.02 4.9 24.3 23.74c1.03.98 2.68-.2 2-1.42l-15.02-29.57"
/>
<path
fill="#fff"
d="M127.99 94.43 67.56 28.5l8.59 51.64-15.38 14.92 62.62 62.23-5.64-51.66 10.24-11.17v-.02Z"
/>
<path
stroke-linejoin="round"
d="M319.08 188.1c.83 0 1.5-.68 1.5-1.5V61.78a1.5 1.5 0 0 0-1.03-1.43c-12.58-4.07-26.24-6.1-41.15-6.1-15.89 0-27.69 3.7-35.21 11.61l-.01.02c-7.34 7.9-10.8 21.53-10.8 39.7 0 18.12 2.9 31.18 9.08 38.73 6.24 7.58 16.04 11.12 28.9 11.12a45.6 45.6 0 0 0 24.04-6.58v37.75c0 .82.68 1.5 1.5 1.5h23.18Zm-24.7-110.05V124c0 1.83-1.37 3.8-4.4 5.4-2.97 1.57-7.24 2.59-12.16 2.59-7.63 0-12.35-1.95-15.04-5.44-1.36-1.75-2.43-4.37-3.16-8.01-.73-3.63-1.09-8.18-1.09-13.7 0-5.86.41-10.72 1.19-14.61.77-3.9 1.9-6.73 3.27-8.58 2.68-3.62 7.73-5.58 15.4-5.58 5.83 0 11.16.62 16 1.98Zm57.89-21.23h-23.52a1.5 1.5 0 0 0-1.4 2.02c10.56 28.23 20.4 59.2 29.52 93.1a1.5 1.5 0 0 0 1.44 1.1h27.18c.64 0 1.2-.4 1.42-1a553.09 553.09 0 0 0 16.4-54.94c5.8 21.37 10.17 39.52 13 54.72a1.5 1.5 0 0 0 1.48 1.23h27.18a1.5 1.5 0 0 0 1.39-.94 1032.42 1032.42 0 0 0 32.34-93.37 1.5 1.5 0 0 0-1.44-1.92h-22.8a1.5 1.5 0 0 0-1.46 1.13c-4.94 19.41-11.47 40.57-19.74 63.65a683.17 683.17 0 0 0-18.07-63.76 1.5 1.5 0 0 0-1.42-1.02H393.5c-.69 0-1.3.47-1.45 1.15a745.57 745.57 0 0 1-18.45 63.76 795.63 795.63 0 0 0-19.84-63.7 1.5 1.5 0 0 0-1.48-1.21h-.02ZM490 58.34v93.23c0 .83.68 1.5 1.5 1.5h23.18c.83 0 1.5-.67 1.5-1.5V58.34c0-.83-.67-1.5-1.5-1.5h-22.93a1.5 1.5 0 0 0-1.74 1.48v.02Zm-1.63-25.93c0 5.22.7 9.05 3.2 11.46 2.48 2.4 6.33 3 11.44 3 5.1 0 8.96-.6 11.44-3 2.5-2.41 3.2-6.24 3.2-11.46 0-4.7-.71-8.2-3.27-10.39-2.47-2.1-6.3-2.62-11.37-2.62-5.08 0-8.9.52-11.37 2.62-2.56 2.18-3.27 5.69-3.27 10.39Zm135.61 24.41h-26.81c-.5 0-.95.24-1.23.64a669.19 669.19 0 0 1-21.85 29.9c-4.19 5.32-7.48 9.12-9.91 11.48V18c0-.83-.67-1.5-1.5-1.5H539.5c-.83 0-1.5.67-1.5 1.5v133.57c0 .83.67 1.5 1.5 1.5h23.18c.83 0 1.5-.67 1.5-1.5V104.9c.67.57 1.44 1.3 2.32 2.24 1.97 2.1 4.4 5.06 7.36 9.03 5.92 7.92 13.93 19.7 24.78 36.21.28.42.75.68 1.26.68h26.64a1.5 1.5 0 0 0 1.28-2.28c-8.77-14.54-16.69-26.35-23.08-34.98-3.2-4.3-6.03-7.83-8.4-10.5a47.47 47.47 0 0 0-4.28-4.35c3.17-2.84 7.23-7.37 12.18-13.51a566.95 566.95 0 0 0 20.85-28.1 1.5 1.5 0 0 0-1.09-2.53h-.02Z"
/>
</svg>
)

61
packages/docs/src/components/core/Social.tsx Normal file
View File

@@ -0,0 +1,61 @@
export const Social = () => {
return (
<>
{/* <title>
💻 Conviértete en un Programador Backend aprendiendo todo de
Cloud y Nodejs
</title>
<meta
property="og:site_name"
content="💻 Conviértete en un Programador Backend aprendiendo todo de Cloud y Nodejs"
/>
<meta
name="description"
content="🚀 Comienza haciendo tus despliegues directamente a la Nube. 🙌 Qué esperas mejorar tus habilidades en la programación ahora mismo."
/>
<meta property="og:type" content="website" />
<meta
name="keywords"
content="cursos programacion, cursos backend, curso de aws, curso de cloud computing, curso de node, curso de typescript, curso de api rest con node, curso de api rest con mongo, curso de api rest con aws"
/>
<meta
property="og:title"
content="💻 Conviértete en un Programador Backend aprendiendo todo de Cloud Computing y Nodejs"
/>
<meta
property="og:description"
content="🚀 Comienza haciendo tus despliegues directamente a la Nube. 🙌 Qué esperas mejorar tus habilidades en la programación ahora mismo."
/>
<meta property="og:type" content="article" />
<meta property="og:locale" content="es_ES" />
<meta
property="og:url"
content="https://campaign.codigoencasa.com"
/>
<meta property="og:site_name" content="campaign.codigoencasa.com" /> */}
<meta
property="og:image"
content="https://i.imgur.com/0HpzsEm.png"
></meta>
<meta
property="og:image:secure_url"
content="https://i.imgur.com/0HpzsEm.png"
/>
<meta property="og:image:type" content="image/png"></meta>
<meta property="og:image:width" content="1200"></meta>
<meta property="og:image:height" content="630"></meta>
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@LeiferMendez" />
<meta
name="twitter:title"
content="💻 Conviértete en un Programador Backend aprendiendo todo de Cloud y Nodejs"
/>
<meta
name="twitter:image"
content="https://i.imgur.com/0HpzsEm.png"
/>
</>
)
}

16
packages/docs/src/components/widgets/CallToAction.tsx
View File

@@ -1,17 +1,23 @@
import { component$ } from '@builder.io/qwik'
import { $, component$, QwikMouseEvent } from '@builder.io/qwik'
export const handleVideo = $((ev: QwikMouseEvent<HTMLVideoElement>) => {
const targetVideo = ev.target as HTMLVideoElement
targetVideo.play()
})
export default component$(() => {
return (
<section class="relative">
<div class="max-w-6xl mx-auto px-4 sm:px-6">
<div class="py-12 md:py-20">
<section class="relative ">
<div class="max-w-6xl mx-auto px-4 sm:px-6 ">
<div class="py-0 md:py-5">
<video
class={'cursor-pointer'}
onClick$={handleVideo}
style={'height:600px'}
width="100%"
height="400"
autoPlay
muted
loop
playsInline
>
<source

32
packages/docs/src/components/widgets/Collaborator.tsx Normal file
View File

@@ -0,0 +1,32 @@
import { component$ } from '@builder.io/qwik'
export default component$(
(props: {
user: {
id: number
login: string
html_url: string
avatar_url: string
}
}) => {
return (
<figure class="bg-gray-50 rounded p-4 dark:bg-slate-800">
<a href={props.user.html_url} target="_blank">
<img
class="w-16 h-16 rounded-full mx-auto object-cover"
src={props.user.avatar_url + '&s=80'}
alt={props.user.login}
width="80"
height="80"
/>
</a>
<div class="pt-2 space-y-4 justify-center flex">
<figcaption class="text-sm">
<div class={'font-semibold'}>{props.user.login}</div>
</figcaption>
</div>
</figure>
)
}
)

85
packages/docs/src/components/widgets/Collaborators.tsx
View File

@@ -1,46 +1,49 @@
import { component$ } from '@builder.io/qwik'
import { RequestHandlerCloudflarePages } from '@builder.io/qwik-city/middleware/cloudflare-pages'
import { User } from '~/contexts'
import Collaborator from './Collaborator'
export default component$(() => {
export const onRequest: RequestHandlerCloudflarePages = async () => {
console.log('??heree')
}
export const TaleUsers = component$((props: { users: User[] }) => {
return (
<div class={'pt-4'}>
<div class="flex items-center space-x-2 text-base">
<h4 class="font-semibold text-slate-900">Contributors</h4>
<span class="rounded-full bg-slate-100 px-2 py-1 text-xs font-semibold text-slate-700">
204
</span>
</div>
<div class="mt-3 flex -space-x-2 overflow-hidden">
<img
class="inline-block h-12 w-12 rounded-full ring-2 ring-white"
src="https://images.unsplash.com/photo-1491528323818-fdd1faba62cc?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80"
alt=""
/>
<img
class="inline-block h-12 w-12 rounded-full ring-2 ring-white"
src="https://images.unsplash.com/photo-1550525811-e5869dd03032?ixlib=rb-1.2.1&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80"
alt=""
/>
<img
class="inline-block h-12 w-12 rounded-full ring-2 ring-white"
src="https://images.unsplash.com/photo-1500648767791-00dcc994a43e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2.25&w=256&h=256&q=80"
alt=""
/>
<img
class="inline-block h-12 w-12 rounded-full ring-2 ring-white"
src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80"
alt=""
/>
<img
class="inline-block h-12 w-12 rounded-full ring-2 ring-white"
src="https://images.unsplash.com/photo-1517365830460-955ce3ccd263?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80"
alt=""
/>
</div>
<div class="mt-3 text-sm font-medium">
<a href="#" class="text-blue-500">
+ 198 others
</a>
</div>
</div>
<>
{props.users.map((user) => (
<div class="col-span-2 ">
{' '}
<Collaborator user={user} />
</div>
))}
</>
)
})
export default component$((props: { users: User[] }) => {
return (
<section class="relative ">
<div class={'px-4 py-16 mx-auto max-w-6xl lg:py-20'}>
<div class="mb-10 md:mx-auto sm:text-center md:mb-12 max-w-3xl">
<p class="text-base text-primary-600 dark:text-purple-200 font-semibold tracking-wide uppercase">
Colaboradores
</p>
<h2 class="text-4xl md:text-5xl font-bold leading-tighter tracking-tighter mb-4 font-heading">
Super estrellas
</h2>
<p class="max-w-3xl mx-auto sm:text-center text-xl text-gray-600 dark:text-slate-400">
Todo es posible gracias a el mayor recursos de todos, el
recurso humano. Tu tambien puedes{' '}
<a class={'font-semibold'} href="/docs/contributing">
formar parte
</a>
</p>
</div>
<div class="grid lg:grid-cols-12 grid-cols-1 gap-4 ">
<TaleUsers users={props.users} />
</div>
</div>
</section>
)
})

41
packages/docs/src/components/widgets/FAQs.tsx
View File

@@ -5,45 +5,36 @@ export default component$(() => {
const items = [
[
{
question: 'What do I need to start?',
answer: `Space, the final frontier. These are the voyages of the Starship Enterprise. Its five-year mission: to explore strange new worlds.
Many say exploration is part of our destiny, but it’s actually our duty to future generations.`,
question: '¿Que necesitas para iniciar?',
answer: `Deseable tener conocimientos previos en JavaScript o ejecución de proyectos Node. La comunidad siempre se encargará de mantener la documentación lo más clara posible para que con solo unos minutos tengas tu chatbot funcionando correctamente`,
},
{
question: 'How to install the Qwik + Tailwind CSS template?',
answer: `Well, the way they make shows is, they make one show. That show's called a pilot.
Then they show that show to the people who make shows, and on the strength of that one show they decide if they're going to make more shows. Some pilots get picked and become television programs. Some don't, become nothing. She starred in one of the ones that became nothing.`,
question: '¿Es Gratis?',
answer: `Si. Es un proyecto Open Source que ofrece el código para que puedas aplicarlo de manera totalmente gratuita. Siempre destacando el valor aportado por toda la comunidad`,
},
{
question:
"What's something that you completely don't understand?",
answer: `A flower in my garden, a mystery in my panties. Heart attack never stopped old Big Bear. I didn't even know we were calling him Big Bear.`,
question: '¿Funciona en Ubuntu/Windows?',
answer: `El proyecto funciona perfectamente Linux/Windows/Mac. Cabe destacar que dependiendo del sistema operativo será necesario realizar algunos ajustes puntuales. En la documentación se explica más estos casos de usos`,
},
],
[
{
question: "What's an example of when you changed your mind?",
answer: `Michael Knight a young loner on a crusade to champion the cause of the innocent. The helpless. The powerless in a world of criminals who operate above the law. Here he comes Here comes Speed Racer. He's a demon on wheels.`,
question: '¿Existe un plan de pago?',
answer: `Actualmente, no contamos con un plan de pago, las aportaciones económicas recibidas se destinan a gastos en comunes: servidores para pruebas, servicios de api externos, recursos de marketing y diseño, recintos para capacitaciones, entre otras cosas.`,
},
{
question:
'What is something that you would really like to try again?',
answer: `A business big enough that it could be listed on the NASDAQ goes belly up. Disappears!
It ceases to exist without me. No, you clearly don't know who you're talking to, so let me clue you in.`,
question: '¿Riesgos dé bloqueo?',
answer: `Depende. Esta librería es una capa superior agnóstica al proveedor que facilita el escribir flujos de conversación. Esto significa que la conexión con "Whatsapp" es delegada al proveedor de turno, el cual dependiendo de cuál elijas, puede tener limitaciones o riesgos. Ver más información`,
},
{
question:
'If you could only ask one question to each person you meet, what would that question be?',
answer: `This is not about revenge. This is about justice. A lot of things can change in twelve years, Admiral. Well, that's certainly good to know. About four years. I got tired of hearing how young I looked.`,
question: '¿Casos de usos?',
answer: `Basado en los relatos compartidos por la comunidad, hasta el momento hemos registrado más de 100 casos de usos. Los más populares suelen ser: asistencia técnica. (preguntas y respuestas), gestión de pedidos de restaurantes, chatbot con inteligencia artificial gracias a dialogflow`,
},
],
]
return (
<section class="border-t border-gray-200 dark:border-slate-800">
<section class="">
<div class="px-4 py-16 mx-auto max-w-6xl lg:py-20">
<div class="max-w-xl sm:mx-auto lg:max-w-2xl">
<div class="max-w-xl mb-10 md:mx-auto sm:text-center lg:max-w-2xl md:mb-12">
@@ -61,10 +52,10 @@ export default component$(() => {
<div class="space-y-8">
{subitems.map(({ question, answer }) => (
<div>
<p class="mb-4 text-xl font-bold">
<IconArrowDownRight class="w-7 h-7 text-secondary-500 inline-block" />
<div class="mb-4 text-xl font-bold">
<IconArrowDownRight class="w-7 h-7 text-primary-600 inline-block" />
{question}
</p>
</div>
{answer
.split('\n\n')
.map((paragraph) => (

4
packages/docs/src/components/widgets/Features.tsx
View File

@@ -15,14 +15,14 @@ export default component$(() => {
'Se pueden automatizar tareas repetitivas y ahorrar tiempo y esfuerzo en tareas administrativas, como enviar recordatorios a tus clientes sobre pagos pendientes o para confirmar citas o reservas.',
},
{
title: 'Experiencia personalizada para tus clientes',
title: 'Experiencia personalizada',
description:
'Podrás enviar mensajes automatizados con ofertas especiales o recomendaciones de productos basadas en el historial de compras de tus clientes, lo que significa que tus clientes pueden recibir una experiencia más personalizada.',
},
],
[
{
title: 'Análisis de datos y toma de decisiones informadas',
title: 'Análisis de datos',
description:
'Te permite recopilar y analizar datos sobre tus clientes para ayudarte a entender mejor sus necesidades y preferencias, y ofrecerles un servicio aún más destacado.',
icon: 'tabler:rocket',

83
packages/docs/src/components/widgets/Footer.tsx
View File

@@ -2,50 +2,20 @@ import { component$ } from '@builder.io/qwik'
import { Link } from '@builder.io/qwik-city'
import { IconTwitter } from '~/components/icons/IconTwitter'
import { IconInstagram } from '~/components/icons/IconInstagram'
import { IconFacebook } from '~/components/icons/IconFacebook'
import { IconGithub } from '~/components/icons/IconGithub'
import { Netlify } from '../atoms/Netlify'
export default component$(() => {
const links = [
{
title: 'Product',
items: [
{ title: 'Features', href: '#' },
{ title: 'Security', href: '#' },
],
},
{
title: 'Platform',
items: [
{ title: 'Developer API', href: '#' },
{ title: 'Partners', href: '#' },
],
},
{
title: 'Support',
items: [
{ title: 'Docs', href: '#' },
{ title: 'Community Forum', href: '#' },
],
},
{
title: 'Company',
items: [
{ title: 'About', href: '#' },
{ title: 'Blog', href: '#' },
],
},
]
const social = [
{ label: 'Twitter', icon: IconTwitter, href: '#' },
{ label: 'Instagram', icon: IconInstagram, href: '#' },
{ label: 'Facebook', icon: IconFacebook, href: '#' },
{
label: 'Twitter',
icon: IconTwitter,
href: 'https://twitter.com/leifermendez',
},
{
label: 'Github',
icon: IconGithub,
href: 'https://github.com/onwidget/qwind',
href: 'https://github.com/codigoencasa/bot-whatsapp',
},
]
@@ -54,36 +24,15 @@ export default component$(() => {
<div class="max-w-6xl mx-auto px-4 sm:px-6">
<div class="grid grid-cols-12 gap-4 gap-y-8 sm:gap-8 py-8 md:py-12">
<div class="col-span-12 lg:col-span-4 pr-8">
<div class="text-sm text-gray-600 dark:text-gray-400">
Nos sentimos muy afortunados de poder contribuir a
este proyecto y esperamos poder seguir trabajando
juntos para ayudar a los pequeños comercios a
impulsar sus ventas y fortalecer la economía local.
<div class="text-sm text-gray-600 dark:text-gray-400"></div>
</div>
<div class="col-span-12 flex justify-center lg:col-span-4 pr-8">
<div class={'flex flex-col justify-center gap-1'}>
<a target={'_blank'} href="https://www.netlify.com">
<Netlify />
</a>
</div>
</div>
{links.map(({ title, items }) => (
<div class="col-span-6 md:col-span-3 lg:col-span-2">
<div class="text-gray-800 dark:text-gray-300 font-medium mb-2">
{title}
</div>
{items &&
Array.isArray(items) &&
items.length > 0 && (
<ul class="text-sm">
{items.map(({ title, href }) => (
<li class="mb-2">
<Link
class="text-gray-600 hover:text-gray-700 hover:underline dark:text-gray-400 transition duration-150 ease-in-out"
href={href}
>
{title}
</Link>
</li>
))}
</ul>
)}
</div>
))}
</div>
<div class="md:flex md:items-center md:justify-between py-6 md:py-8">
<ul class="flex mb-4 md:order-1 -ml-2 md:ml-4 md:mb-0">
@@ -101,7 +50,7 @@ export default component$(() => {
))}
</ul>
<div class="text-sm text-gray-700 mr-4 dark:text-slate-400">
{/* <div class="text-sm text-gray-700 mr-4 dark:text-slate-400">
<span class="w-5 h-5 md:w-6 md:h-6 md:-mt-0.5 bg-cover mr-1.5 float-left rounded-sm bg-[url(https://onwidget.com/favicon/favicon-32x32.png)]"></span>
Made by{' '}
<a
@@ -112,7 +61,7 @@ export default component$(() => {
onWidget
</a>{' '}
· All rights reserved.
</div>
</div> */}
</div>
</div>
</footer>

7
packages/docs/src/components/widgets/Header.tsx
View File

@@ -45,9 +45,12 @@ export default component$(() => {
>
<ul class="flex flex-col pt-8 md:pt-0 md:flex-row md:self-center w-full md:w-auto text-xl md:text-base">
<li class="dropdown">
<button class="font-medium hover:text-gray-900 dark:hover:text-white px-4 py-3 flex items-center transition duration-150 ease-in-out">
<a
href="/docs"
class="font-medium hover:text-gray-900 dark:hover:text-white px-4 py-3 flex items-center transition duration-150 ease-in-out"
>
Documentación
</button>
</a>
<ul class="dropdown-menu rounded md:absolute pl-4 md:pl-0 md:hidden font-medium md:bg-white md:min-w-[200px] dark:md:bg-slate-800 drop-shadow-xl">
{store.map((ctx) => {
return ctx.list.map((listCtx) => {

6
packages/docs/src/components/widgets/Hero.tsx
View File

@@ -26,10 +26,10 @@ export default component$(() => {
</h1>
<div class="max-w-3xl mx-auto">
<p class="text-xl text-gray-600 mb-8 dark:text-slate-400">
<span class="font-semibold underline decoration-wavy decoration-1 decoration-secondary-600 underline-offset-2">
<span class="font-semibold ">
Con esta libreria,{' '}
</span>
<span class="font-semibold underline decoration-wavy decoration-1 decoration-secondary-600 underline-offset-2">
<span class="font-semibold ">
puedes configurar respuestas
automatizadas para preguntas frecuentes
</span>{' '}
@@ -52,7 +52,7 @@ export default component$(() => {
href="/docs"
class="btn bg-gray-50 dark:bg-transparent"
>
Más información
Ver documentación
</a>
</div>
</div>

15
packages/docs/src/components/widgets/SponsorBar.tsx
View File

@@ -5,6 +5,8 @@ import { useLocation } from '@builder.io/qwik-city'
import { src as qwik } from '~/assets/images/qwik.png?width=100&metadata'
// @ts-ignore
import { src as leanga } from '~/assets/images/leanga.png?width=40&metadata'
// @ts-ignore
import { src as netlify } from '~/assets/images/full-logo-light.png?width=100&metadata'
/**
* options = [] array con la lista de opciones de la documentacion
@@ -33,6 +35,19 @@ export default component$(() => {
</picture>
</a>
</li>
<li>
<a target={'_blank'} href="https://www.netlify.com">
<picture>
<img
src={netlify}
class="border border-slate-200 rounded my-2 p-1 bg-gray-50 dark:border-gray-600 dark:bg-gray-700"
alt="Qwind Hero Image (Cool dog)"
loading="eager"
decoding="async"
/>
</picture>
</a>
</li>
<li>
<a target={'_blank'} href="https://leangasoftware.es/">
<picture>

9
packages/docs/src/contexts/index.tsx
View File

@@ -6,7 +6,12 @@ export interface DocumentationCtx {
list: { link: string; name: string }[]
}
export interface User {
id: number
login: string
html_url: string
avatar_url: string
}
export const GlobalStore =
createContext<DocumentationCtx[]>('documentation-site')
export const AppSetting = createContext<{ repo: string }>('app-settings')

50
packages/docs/src/entry.express.tsx Normal file
View File

@@ -0,0 +1,50 @@
/*
* WHAT IS THIS FILE?
*
* It's the entry point for the express server when building for production.
*
* Learn more about the cloudflare integration here:
* - https://qwik.builder.io/qwikcity/adaptors/node/
*
*/
import { createQwikCity } from '@builder.io/qwik-city/middleware/node'
import qwikCityPlan from '@qwik-city-plan'
import render from './entry.ssr'
import express from 'express'
import { fileURLToPath } from 'node:url'
import { join } from 'node:path'
import compression from 'compression'
// Directories where the static assets are located
const distDir = join(fileURLToPath(import.meta.url), '..', '..', 'dist')
const buildDir = join(distDir, 'build')
// Allow for dynamic port
const PORT = process.env.PORT ?? 3000
// Create the Qwik City express middleware
const { router, notFound } = createQwikCity({ render, qwikCityPlan })
// Create the express server
// https://expressjs.com/
const app = express()
// Enable gzip compression
app.use(compression())
// Static asset handlers
// https://expressjs.com/en/starter/static-files.html
app.use(`/build`, express.static(buildDir, { immutable: true, maxAge: '1y' }))
app.use(express.static(distDir, { redirect: false }))
// Use Qwik City's page and endpoint request handler
app.use(router)
// Use Qwik City's 404 handler
app.use(notFound)
// Start the express server
app.listen(PORT, () => {
/* eslint-disable */
console.log(`Server starter: http://localhost:${PORT}/`)
})

14
packages/docs/src/entry.netlify-edge.tsx Normal file
View File

@@ -0,0 +1,14 @@
/*
* WHAT IS THIS FILE?
*
* It's the entry point for netlify-edge when building for production.
*
* Learn more about the cloudflare integration here:
* - https://qwik.builder.io/qwikcity/adaptors/netlify-edge/
*
*/
import { createQwikCity } from '@builder.io/qwik-city/middleware/netlify-edge'
import qwikCityPlan from '@qwik-city-plan'
import render from './entry.ssr'
export default createQwikCity({ render, qwikCityPlan })

4
packages/docs/src/root.tsx
View File

@@ -16,6 +16,7 @@ import { DarkThemeLauncher } from '~/components/core/DarkThemeLauncher'
import fontStyles from '~/assets/styles/fonts.css?inline'
import globalStyles from '~/assets/styles/global.css?inline'
import { DocumentationCtx, GlobalStore } from './contexts'
import { Social } from './components/core/Social'
export default component$(() => {
/**
@@ -33,6 +34,7 @@ export default component$(() => {
title: 'Primeros pasos',
list: [
{ name: 'Vista rápida', link: '/docs' },
{ name: 'Requerimientos', link: '/docs/requirements' },
{ name: 'Instalación', link: '/docs/install' },
{ name: 'Pruebalo', link: '/docs/example' },
],
@@ -57,6 +59,7 @@ export default component$(() => {
title: 'Comunidad',
list: [
{ name: 'MasterClass', link: '/docs/masterclass' },
{ name: 'Colabores', link: '/docs/contributing' },
{ name: 'Unirme al proyecto', link: '/docs/join' },
{ name: 'Sponsors', link: '/docs/sponsors' },
],
@@ -77,6 +80,7 @@ export default component$(() => {
<RouterHead />
<DarkThemeLauncher />
<Social />
</head>
<body class="text-gray-900 dark:text-slate-300 tracking-tight bg-white dark:bg-gray-900 antialiased">
<RouterOutlet />

1
packages/docs/src/routes/docs/constant.ts Normal file
View File

@@ -0,0 +1 @@
export const GITHUB_TOKEN = import.meta.env.VITE_GITHUB_TOKEN ?? 'SIN_TOKEN'

1
packages/docs/src/routes/docs/contribuiting/index.mdx
View File

@@ -1 +0,0 @@
# Personas que quieran unirse

121
packages/docs/src/routes/docs/contributing/index.mdx Normal file
View File

@@ -0,0 +1,121 @@
# Colaboradores
<iframe
width="560"
height="315"
src="https://www.youtube.com/embed/Mf9V-dloBfk"
title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen
></iframe>
### 📄 Bienvenido/a
Si deseas colaborar con el proyecto existen varias maneras, la primera de ellas es aportando conocimiento y mejorando el repositorio (actualizando documentación, mejorando código, revisando **[issues](https://github.com/codigoencasa/bot-whatsapp/issues)**, etc).
También es bien recibido los aportes económicos que se utilizaran para diferentes fines **[ver más](https://opencollective.com/bot-whatsapp)**
El lenguaje principal que se utilizó para desarrollar este proyecto fue **JavaScript** con el fin de qué personas que están iniciando en el mundo de la programación puedan entender fácilmente.
### 🤔 Preguntas frecuentes
- ¿Como puedo hacer aportaciones de código en el proyecto?: [Ver Video](https://youtu.be/Lxt8Acob6aU)
- ¿Como ejecutar el entorno de pruebas?: [Ver Video](https://youtu.be/Mf9V-dloBfk)
- ¿Como crear un nuevo proveedor?: [Ver Video](https://youtu.be/cahK9zH3SI8)
- ¿Que son los GithubActions?: [Ver Video](https://youtu.be/nYBEBFKLiqw)
- ¿Canales de comunicación?: [Discord](https://link.codigoencasa.com/DISCORD)
---
![](https://i.giphy.com/media/ntMt6TvalpstTIx7Ak/giphy.webp)
**Requerimientos:**
- Node v16 o superior **[descargar node](https://nodejs.org/es/download/)**
- **[Yarn](https://classic.yarnpkg.com/lang/en/docs/install/#windows-stable)** como gestor de paquetes. En el link conseguirás las intrucciones para instalar yarn.
- **[VSCode](https://code.visualstudio.com/download)** (recomendado): Editor de código con plugins.
- **[Conventional Commits](https://marketplace.visualstudio.com/items?itemName=vivaxy.vscode-conventional-commits&ssr=false#overview)** (plugin-vscode) este plugin te ayudará a crear commit semántico.
- Se usará la rama **dev** _(https://github.com/leifermendez/bot-whatsapp/tree/dev)_ como rama principal hasta que se haga oficialmente el lanzamiento de la V2.
### 🚀 Iniciando
**Clonar repo rama dev**
```
git clone --branch dev https://github.com/codigoencasa/bot-whatsapp
```
**Instalar dependencias**
```
cd bot-whatsapp
yarn install
```
**Compilar (build)**
Para compilar la aplicación es necesario ejecutar este comando, el cual genera un directorio `lib` dentro de los paquetes del monorepo.
```
yarn build
```
**Example-app**
Se ejecuta el CLI (Command Line Interface) para ayudarte a crear un app-bot de ejemplo.
```
yarn run cli
```
Selecionas (mediante las flechas arriba y abajo) el proveedor que quieras usar y cuando estes sobre el presiona la barra de espacio, igualmente selecciona la base de datos que quieras usar.
Se creó un subdirecorio con el nombre del proveedor y base de datos que seleccionaste, ejemplo: `base-bailey-mysql`
Dentro de ese directorio necesitas editar el archivo package.json y borrar las siguientes lineas:
```
"@bot-whatsapp/bot": "latest",
"@bot-whatsapp/cli": "latest",
"@bot-whatsapp/database": "latest",
"@bot-whatsapp/provider": "latest",
```
Cambiate al directorio creado ejemplo: `base-bailey-mysql`
```
cd base-baileys-mysql
```
Ejecuta los comandos:
```
npm install
npm run pre-copy
npm start
```
En el caso de MySql y Mongo es necesario especificar en app.js los datos de la conexión, ejemplo de MySql:
```
const BaileysProvider = require('@bot-whatsapp/provider/baileys')
const MySQLAdapter = require('@bot-whatsapp/database/mysql')
/**
* Declaramos las conexiones de MySQL
*/
const MYSQL_DB_HOST = 'localhost'
const MYSQL_DB_USER = 'usr'
const MYSQL_DB_PASSWORD = 'pass'
const MYSQL_DB_NAME = 'bot'
```
![](https://i.imgur.com/dC6lEwy.png)
> **NOTA:** [Eres libre de aportar informacion a este documento o arreglar ortografia 🤣](https://github.com/codigoencasa/bot-whatsapp/edit/dev/CONTRIBUTING.md)
---
- [Discord](https://link.codigoencasa.com/DISCORD)
- [Twitter](https://twitter.com/leifermendez)
- [Youtube](https://www.youtube.com/watch?v=5lEMCeWEJ8o&list=PL_WGMLcL4jzWPhdhcUyhbFU6bC0oJd2BR)
- [Telegram](https://t.me/leifermendez)

10
packages/docs/src/routes/docs/database/index.mdx
View File

@@ -1,4 +1,5 @@
import Alert from '../../../components/widgets/Alert'
import Navigation from '../../../components/widgets/Navigation'
# DataBase (Base de datos)
@@ -30,3 +31,12 @@ Los conectores disponibles hasta el momento son los siguientes:
`require('@bot-whatsapp/database/mysql')`
`require('@bot-whatsapp/database/json')`
---
<Navigation
pages={[
{ name: 'Proveedores', link: '/docs/providers' },
{ name: 'Migración', link: '/docs/migration' },
]}
/>

10
packages/docs/src/routes/docs/essential/index.mdx
View File

@@ -1,4 +1,5 @@
import Alert from '../../../components/widgets/Alert'
import Navigation from '../../../components/widgets/Navigation'
# Conceptos
@@ -97,3 +98,12 @@ Los conectores disponibles hasta el momento son los siguientes:
`require('@bot-whatsapp/database/mysql')`
`require('@bot-whatsapp/database/json')`
---
<Navigation
pages={[
{ name: 'Pruebalo', link: '/docs/example' },
{ name: 'Conversaciones', link: '/docs/flows' },
]}
/>

11
packages/docs/src/routes/docs/example/index.mdx
View File

@@ -1,3 +1,5 @@
import Navigation from '../../../components/widgets/Navigation'
# Ejemplo
Si copias y pegas este codigo y tu entorno de trabajo cumple con todos los requesitos te debe funcionar abajo explico muy por encima
@@ -66,3 +68,12 @@ const flowPrincipal = addKeyword(['hola', 'alo'])
.addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
.addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
```
---
<Navigation
pages={[
{ name: 'Instalación', link: '/docs/install' },
{ name: 'Conceptos', link: '/docs/essential' },
]}
/>

11
packages/docs/src/routes/docs/flows/index.mdx
View File

@@ -1,3 +1,5 @@
import Navigation from '../../../components/widgets/Navigation'
# Flow (Flujos)
Los flujos hacen referencia al hecho de construir un flujo de conversación. Estos son flows y en ellos podemos observar que estan presente dos metodos importantes **addKeyword** y el **addAnswer**.
@@ -18,3 +20,12 @@ const flowPrincipal = addKeyword(['hola', 'alo'])
.addAnswer(['Hola, bienvenido a mi tienda', '¿Como puedo ayudarte?'])
.addAnswer(['Tengo:', 'Zapatos', 'Bolsos', 'etc ...'])
```
---
<Navigation
pages={[
{ name: 'Conceptos', link: '/docs/essential' },
{ name: 'Proveedores', link: '/docs/providers' },
]}
/>

28
packages/docs/src/routes/docs/index.mdx
View File

@@ -1,20 +1,21 @@
import Alert from '../../components/widgets/Alert'
import Navigation from '../../components/widgets/Navigation'
# Introducción
<Alert>
**Atención** estás leyendo la documentación de la **versión estable
(0.2.x)** de esta librería, si vienes de la versión anterior te recomendamos
pasarte por la sección de **[migración](/docs/migration/)** para que puedas
disfrutar de las nuevas características.
**Atención** estás leyendo la documentación de la **versión v2** de esta
librería, si vienes de la versión anterior te recomendamos pasarte por la
sección de **[migración](/docs/migration/)** para que puedas disfrutar de
las nuevas características.
</Alert>
## ¿Que es esto?
## ¿Qué es esto?
**@bot-whatsapp** es una librería que te permitirá **crear chatbot para WhatsApp** en tan solo minutos de una manera ágil y rápida. A lo largo de esta documentación encontrarás ejemplos y material de ayuda.
Si eres una persona con **poco tiempo y gran capacidad** de comprensión con conocimientos, ejecutando proyectos en Node.js y manejo de terminal.
Esta documentación te ayudará a instalar tu bot de WhatsApp en simples pasos con el propósito de que tengas un chatbot funcional **en solo minutos.**
Si eres una persona con **poco tiempo y gran capacidad** de comprensión, con conocimientos ejecutando proyectos en Node.js y manejo de terminal.
Esta documentación te ayudará a instalar tu bot de WhatsApp en simples pasos; con el propósito de que tengas un chatbot funcional **en solo minutos.**
---
@@ -40,5 +41,14 @@ npm create bot-whatsapp@latest
</video>
</div>
**¿Algun error?**
Recuerda que debes de cumplir con los [requisitos minimos](/docs/install) del sistema
**¿Algún error?**
Recuerda que debes de cumplir con los [requisitos minimos](/docs/requirements) del sistema
---
<Navigation
pages={[
{ name: 'Home', link: '/' },
{ name: 'Requerimientos', link: '/docs/requirements' },
]}
/>

63
packages/docs/src/routes/docs/install/index.mdx
View File

@@ -1,32 +1,27 @@
import Alert from '../../../components/widgets/Alert'
import Navigation from '../../../components/widgets/Navigation'
# Instalación
A continuación se describen los puntos técnicos que debes de tener en cuenta antes de trabajar con esta herramienta
**Con esta librería, puedes construir flujos automatizados de conversación de manera agnóstica al proveedor de WhatsApp,** configurar respuestas automatizadas para preguntas frecuentes, recibir y responder mensajes de manera automatizada, y hacer un seguimiento de las interacciones con los clientes. Además, puedes configurar fácilmente disparadores que te ayudaran a expandir las funcionalidades sin límites.
## Requerimientos
---
- Node v16 o superior **[descargar node](https://nodejs.org/es/download/)**
### Comenzamos
## ¿Como saber que tengo el Node?
Solo debes ejecutar el siguiente comando y esperar que la versión que te arroja sea superior a v16
Crear un bot es tan sencillo como ejecutar el siguiente comando y seguir las instrucciones
```shell
$ node -v
v18.12.1
npm create bot-whatsapp@latest
```
## Opcionales
_Para seleccionar usa la tecla de **espacio** y para confirmar la tecla **enter**_
Dependiendo de las opciones de configuraciones que has marcado al momento de crear el bot **Command Line Interface (CLI)** puede que necesites instalar más cosas.
El **CLI** te hace una revisión previa, de versión de Node y sistema operativo, con la finalidad de informarte si cumples los requisitos o mostrarte información de interés.
**Ejemplo**: Si elegiste _(MySQL)_ como proveedor de base de datos, lógicamente necesitaras tener un entorno de MySQL.
📄 Pronto se agregará más información y videos explicando esto a fondo.
<div class="my-4 w-full ">
<div class="my-4 ">
<video
class="rounded drop-shadow-xl rounded "
width="100%"
class="rounded drop-shadow-xl w-full md:w-full max-w-screen-md"
height="100%"
autoplay
loop
@@ -39,3 +34,37 @@ Dependiendo de las opciones de configuraciones que has marcado al momento de cre
/>
</video>
</div>
### Plantilla
Luego de seleccionar las opciones de tu preferencia se creara una carpeta con una plantilla de un flujo de un bot listo para ejecutar y que puedes modificar a tu gusto.
**[Ver más plantillas](https://github.com/codigoencasa/bot-whatsapp/tree/dev/starters/apps)**
Cada plantilla tiene sus dependencias necesarias basadas en tu previa selección. **Ejemplo**, si seleccionas el proveedor de MySQL, la plantilla incorpora lo necesario para que tu conexión con la base de datos sea exitosa.
```json
"dependencies": {
"@bot-whatsapp/bot": "latest",
"@bot-whatsapp/cli": "latest",
"@bot-whatsapp/database": "latest",
"@bot-whatsapp/provider": "latest",
"@adiwajshing/baileys": "4.4.0",
"mysql2": "^2.3.3", 👈
},
```
<Alert>
📄 Si deseas cambiar tu **proveedor o tu motor** de base de datos no es
necesario volver ejecutar el CLI (lo puedes hacer sin problema) aunque
tambien basta con solo modificar un par de lineas. [Ver
explicación](/docs/essential)
</Alert>
---
<Navigation
pages={[
{ name: 'Requerimientos', link: '/docs/requirements' },
{ name: 'Pruebalo', link: '/docs/example' },
]}
/>

24
packages/docs/src/routes/docs/join/index.mdx
View File

@@ -1,3 +1,25 @@
# Unirme
...
Bienvenido al proyecto! Estamos emocionados de tenerte a bordo y esperamos trabajar contigo.
Deseamos que te sientas cómodo y que puedas aportar tu valioso conocimiento y habilidades.
Recuerda que si tienes alguna inquietud, o simplemente deseas interactuar con los otros colaboradores puedes unirte a la comunidad.
---
## Ventajas al unirme
Participar en un proyecto de código abierto te permite aprender de manera práctica sobre tecnologías y metodologías de desarrollo de software. También puedes aprender de otros desarrolladores y contribuir a la comunidad de código abierto.
Al unirte te estará brindando la oportunidad de **adquirir experiencia en el desarrollo de software** y en el trabajo en equipo. Esto puede ser muy valioso para tu currículum y para tu carrera profesional.
La visibilidad es uno de los puntos que más se requieren hoy en día, al unirte se te brinda la oportunidad de **mayor visibilidad en la comunidad de desarrolladores y de demostrar tus habilidades**. Esto puede ayudarte a encontrar oportunidades de trabajo o a colaborar con otros proyectos.
Colaboración con otros desarrolladores de todo el mundo y **trabajar juntos para mejorar el proyecto** Al trabajar en equipo y colaborar con otros, podrás mejorar tu comunicación, resolución de problemas y liderazgo, habilidades que cada vez son más demandadas en el entorno laboral.
Contribución al bien común Participar en un proyecto de código abierto te permite contribuir a la comunidad y a la sociedad en general, ya que el código abierto es accesible y utilizable por cualquier persona. **Esto puede ser muy gratificante y sentirte parte de algo más grande**.
Es una excelente manera de incrementar tus habilidades tecnológicas y **estar al tanto de las últimas tendencias y desarrollos en el mundo del software**. Al trabajar con otros desarrolladores y contribuir a proyectos de código abierto, tendrás la oportunidad de \*\*aprender y practicar nuevas tecnologías y metodologías, lo que te ayudará a mejorar tus habilidades y a mantenerte actualizado en el mundo en constante cambio de la tecnología.
Esperamos que estés listo para **unirte a nosotros en esta emocionante aventura**

2
packages/docs/src/routes/docs/layout!.tsx
View File

@@ -1,7 +1,6 @@
import { component$, Slot, useContext } from '@builder.io/qwik'
import type { DocumentHead } from '@builder.io/qwik-city'
import ExtraBar from '~/components/widgets/ExtraBar'
import Footer from '~/components/widgets/Footer'
import Header from '~/components/widgets/Header'
import NavBar from '~/components/widgets/NavBar'
import SponsorBar from '~/components/widgets/SponsorBar'
@@ -44,7 +43,6 @@ export default component$(() => {
</div>
</div>
</main>
<Footer />
</>
)
})

14
packages/docs/src/routes/docs/migration/index.mdx
View File

@@ -1,3 +1,5 @@
import Navigation from '../../../components/widgets/Navigation'
# Migración
#### Versión (legacy)
@@ -199,9 +201,11 @@ const flowPrincipal = addKeyword(['hola', 'ole', 'alo'])
)
```
> Forma parte de este proyecto.
---
- [Discord](https://link.codigoencasa.com/DISCORD)
- [Twitter](https://twitter.com/leifermendez)
- [Youtube](https://www.youtube.com/watch?v=5lEMCeWEJ8o&list=PL_WGMLcL4jzWPhdhcUyhbFU6bC0oJd2BR)
- [Telegram](https://t.me/leifermendez)
<Navigation
pages={[
{ name: 'Base de datos', link: '/docs/database' },
{ name: 'Extender', link: '/docs/custom' },
]}
/>

10
packages/docs/src/routes/docs/providers/index.mdx
View File

@@ -1,4 +1,5 @@
import Alert from '../../../components/widgets/Alert'
import Navigation from '../../../components/widgets/Navigation'
# Provider (Proveedor)
@@ -29,3 +30,12 @@ Los proveedores disponibles hasta el momento son los siguientes:
[Meta Official](https://developers.facebook.com/docs/whatsapp/cloud-api/reference/messages) `require('@bot-whatsapp/provider/meta')`
[Twilio Official](https://www.twilio.com/es-mx/messaging/whatsapp) `require('@bot-whatsapp/provider/twilio')`
---
<Navigation
pages={[
{ name: 'Conversaciones', link: '/docs/flows' },
{ name: 'Base de datos', link: '/docs/database' },
]}
/>

34
packages/docs/src/routes/docs/requirements/index.mdx Normal file
View File

@@ -0,0 +1,34 @@
import Navigation from '../../../components/widgets/Navigation'
# Requerimientos
A continuación se describen los puntos técnicos que debes de tener en cuenta antes de trabajar con esta herramienta
- Node v16 o superior **[descargar node](https://nodejs.org/es/download/)**
---
## ¿Como instalar Node?
- **Windows**: [Ver video](https://youtu.be/xRXHQlqA3Ak?t=376). Necesita ayuda para instalar Node en Windows. A continuación te comparto un video en el minuto exacto donde explico como instalar.
- **Ubuntu**: Te comparto un recurso de **[Digital Ocean](https://www.digitalocean.com/community/tutorials/how-to-install-node-js-on-ubuntu-20-04-es)** donde explica como instalar node en Ubuntu.
---
## ¿Como saber que tengo el Node?
Solo debes ejecutar el siguiente comando y esperar que la versión que te arroja sea superior a v16
```shell
$ node -v
v18.12.1
```
---
<Navigation
pages={[
{ name: 'Vista rápida', link: '/docs' },
{ name: 'Instalación', link: '/docs/install' },
]}
/>

25
packages/docs/src/routes/index.tsx
View File

@@ -1,20 +1,35 @@
import { component$ } from '@builder.io/qwik'
import type { DocumentHead } from '@builder.io/qwik-city'
import { component$, Resource } from '@builder.io/qwik'
import { DocumentHead, useEndpoint } from '@builder.io/qwik-city'
import Hero from '~/components/widgets/Hero'
import Features from '~/components/widgets/Features'
import FAQs from '~/components/widgets/FAQs'
// import Stats from '~/components/widgets/Stats'
import CallToAction from '~/components/widgets/CallToAction'
import Collaborators from '~/components/widgets/Collaborators'
import { fetchGithub } from '~/services/github'
import { RequestHandlerNetlify } from '@builder.io/qwik-city/middleware/netlify-edge'
import { GITHUB_TOKEN } from './docs/constant'
export const onGet: RequestHandlerNetlify = async ({ platform }) => {
const CHECK_GITHUB_TOKEN =
(platform as any)?.['GITHUB_TOKEN'] ?? GITHUB_TOKEN
console.log(`[🚩 platform]: `, GITHUB_TOKEN)
const data = await fetchGithub(CHECK_GITHUB_TOKEN)
return data
}
export default component$(() => {
const resource = useEndpoint()
return (
<>
<Hero />
<Features />
<CallToAction />
<Resource
value={resource}
onResolved={(data: any) => <Collaborators users={data} />}
></Resource>
<FAQs />
{/* <Stats /> */}
</>
)
})

19
packages/docs/src/services/github.ts Normal file
View File

@@ -0,0 +1,19 @@
/**
* GET API from Github
* @returns
*/
export const fetchGithub = async (token: string) => {
const data = await fetch(
`https://api.github.com/repos/codigoencasa/bot-whatsapp/contributors`,
{
method: 'GET',
headers: {
Accept: 'application/vnd.github+json',
'X-GitHub-Api-Version': '2022-11-28',
Authorization: `Bearer ${token}`,
},
}
)
const listUsers = data.json()
return listUsers
}

5
packages/docs/vite.config.ts
View File

@@ -13,11 +13,6 @@ export default defineConfig(() => {
qwikCity({
basePathname: SITE.basePathname,
trailingSlash: SITE.trailingSlash,
mdxPlugins: {
rehypeSyntaxHighlight: true,
rehypeAutolinkHeadings: false,
remarkGfm: true,
},
}),
qwikVite(),
tsconfigPaths(),