The latest articles on Forem by Fabian Reyes (@elreyes). https://forem.com/elreyes https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F671700%2Fd6000539-49ae-41e2-861b-648757301250.jpg https://forem.com/elreyes en Fabian Reyes Tue, 03 May 2022 14:30:40 +0000 https://forem.com/elreyes/made-with-appwrite-final-post-appwrite-hackaton-3co0 https://forem.com/elreyes/made-with-appwrite-final-post-appwrite-hackaton-3co0 <h2> This is the final post for Made With Appwrite </h2> <p>First you must create your account, after this you are ready to submit your projects.</p> <h2> Submit Project </h2> <p>The available fields are the following:</p> <ul> <li>Name, Description, Webpage, Repo, URL, Appwrite (Select the Appwrite services your application uses), License type selector and the promotional image.</li> </ul> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--X9P9F6Vw--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ze72yucvvodemgw946n3.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--X9P9F6Vw--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ze72yucvvodemgw946n3.png" alt="Image projects" width="828" height="562"></a></p> <h2> Review Published Project </h2> <p>Once your project is approved you can view it on our website. </p> <p>You can see the link to your website and the link to your repository.</p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--4GdC_zFF--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wir6ppmwu8lcosyddkbo.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--4GdC_zFF--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wir6ppmwu8lcosyddkbo.png" alt="Image links" width="880" height="425"></a></p> <p>You can also see which Appwrite services each project uses, and clicking on its name will take you to the official Appwrite documentation.</p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--dZgaqhJu--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bdauj66mnamynh3u9wqd.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--dZgaqhJu--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bdauj66mnamynh3u9wqd.png" alt="Image services" width="880" height="425"></a></p> <h2> Review your published projects </h2> <p>From the dashboard you can review the projects you have posted and you have the possibility to delete them if you wish.</p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--SdaFHI_F--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fyqq9z0nek2jco1mwk1b.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--SdaFHI_F--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fyqq9z0nek2jco1mwk1b.png" alt="Image dashboard" width="880" height="343"></a></p> <h2> Admin panel </h2> <p>From the admin panel the manager can review the project submission request and has the possibility to enable, disable or delete them if desired.</p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--HRgabGfG--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9wycbk4vuj6dsuu25rfn.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--HRgabGfG--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9wycbk4vuj6dsuu25rfn.png" alt="Image admin" width="880" height="274"></a></p> <h2> Enjoy submitting your projects made with Appwrite ! !!! 🙂 🚀 </h2> <h3> Project page </h3> <div class="crayons-card c-embed text-styles text-styles--secondary"> <div class="c-embed__cover"> <a href="https://madewithappwrite.com/" class="c-link s:max-w-50 align-middle" rel="noopener noreferrer"> <img alt="" src="https://res.cloudinary.com/practicaldev/image/fetch/s--yPWObco1--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://res.cloudinary.com/dim6sxove/image/upload/v1650398455/hrfmztyw7dbko2a7qssv.png" height="463" class="m-0" width="880"> </a> </div> <div class="c-embed__body"> <h2 class="fs-xl lh-tight"> <a href="https://madewithappwrite.com/" rel="noopener noreferrer" class="c-link"> Made With Appwrite | Appwrite </a> </h2> <p class="truncate-at-3"> An accurate and verified list of production-ready projects made with Appwrite </p> <div class="color-secondary fs-s flex items-center"> <img alt="favicon" class="c-embed__favicon m-0 mr-2 radius-0" src="https://res.cloudinary.com/practicaldev/image/fetch/s--b7zo2Z5_--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://madewithappwrite.com/img/icons/favicon-32x32.png" width="32" height="32"> madewithappwrite.com </div> </div> </div> <h3> Repository URL </h3> <div class="ltag-github-readme-tag"> <div class="readme-overview"> <h2> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--566lAguM--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev.to/assets/github-logo-5a155e1f9a670af7944dd5e12375bc76ed542ea80224905ecaf878b9157cdefc.svg" alt="GitHub logo"> <a href="https://github.com/reyesmfabian"> reyesmfabian </a> / <a href="https://github.com/reyesmfabian/made-with-appwrite"> made-with-appwrite </a> </h2> <h3> An accurate and verified list of production-ready projects made with Appwrite </h3> </div> <div class="ltag-github-body"> <div id="readme" class="md"> <h2> Made with Appwrite ✨ ✨ </h2> <h2> An accurate and verified list of production-ready projects made with Appwrite.</h2> <p>Table of Contents:</p> <ul> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#Requirements">Requirements</a></li> <li> <a href="https://github.com/reyesmfabian/made-with-appwrite#Server-Configuration">Server Configuration</a> <ul> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#Download-Script">Download Script</a></li> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#Project-Configuration">Project Configuration</a></li> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#Run-Script">Run Script</a></li> </ul> </li> <li> <a href="https://github.com/reyesmfabian/made-with-appwrite#Client-Installation">Client Installation</a> <ul> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#Project-Setup">Project Setup</a></li> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#Install-dependencies">Install dependencies</a></li> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#Enter-server-information">Enter server information</a></li> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#Compile-and-hot-reload-for-development">Compile and hot reload for development</a></li> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#Compile-and-minify-for-production">Compile and minify for production</a></li> </ul> </li> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#license">License</a></li> </ul> <h2> Requirements.</h2> <ul> <li>Appwrite Server Instance with version 0.11.1</li> <li>node js 6+</li> <li>npm 14+</li> </ul> <h2> Server Configuration</h2> <h3> Download Script</h3> <div class="snippet-clipboard-content position-relative overflow-auto"><pre class="notranslate"><code class="notranslate">Clone "create_server" folder </code></pre></div> <h3> Project Configuration</h3> <div class="snippet-clipboard-content position-relative overflow-auto"><pre class="notranslate"><code class="notranslate">npm install </code></pre></div> <h3> Run Script</h3> <div class="snippet-clipboard-content position-relative overflow-auto"><pre class="notranslate"><code class="notranslate">npm start </code></pre></div> <ul> <li>Follow the instructions and save the final information</li> </ul> <h2> Client Installation</h2> <h3> Project Setup</h3> <div class="snippet-clipboard-content position-relative overflow-auto"><pre class="notranslate"><code class="notranslate">Cloning the Project </code></pre></div> <h3> Install dependencies</h3> <div class="snippet-clipboard-content position-relative overflow-auto"><pre class="notranslate"><code class="notranslate">npm install </code></pre></div> <h3> Enter server information</h3> <div class="snippet-clipboard-content position-relative overflow-auto"><pre class="notranslate"><code class="notranslate">Edit .env file with server information </code></pre></div> <h3> Compile and hot reload for development</h3> <div class="snippet-clipboard-content position-relative overflow-auto"><pre class="notranslate"><code class="notranslate">npm serve </code></pre></div> <h3> Compile and minify for production</h3> <div class="snippet-clipboard-content position-relative overflow-auto"><pre class="notranslate"><code class="notranslate">npm build </code></pre></div> <h3> License</h3> <p>The source code of the site is licensed under the MIT license, which you can find in the MIT-LICENSE.txt file.</p> </div> </div> <br> <div class="gh-btn-container"><a class="gh-btn" href="https://github.com/reyesmfabian/made-with-appwrite">View on GitHub</a></div> <br> </div> <br> <h2> Made from the heart with Appwrite, Happy Coding! </h2> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--k5INcBqL--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8l13ic6h3iubr0s2vcug.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--k5INcBqL--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8l13ic6h3iubr0s2vcug.png" alt="Image appwrite" width="600" height="140"></a></p> appwritehack javascript webdev vue Fabian Reyes Sat, 23 Apr 2022 02:58:11 +0000 https://forem.com/elreyes/made-with-appwrite-now-live--30ba https://forem.com/elreyes/made-with-appwrite-now-live--30ba <h2> Made With Appwrite is now live </h2> <p>Feel free to test it and add your project 🥳 🥳 🥳</p> <div class="ltag__link"> <a href="/elreyes" class="ltag__link__link"> <div class="ltag__link__pic"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--yW0igFrc--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://res.cloudinary.com/practicaldev/image/fetch/s--72MTQjIy--/c_fill%2Cf_auto%2Cfl_progressive%2Ch_150%2Cq_auto%2Cw_150/https://dev-to-uploads.s3.amazonaws.com/uploads/user/profile_image/671700/d6000539-49ae-41e2-861b-648757301250.jpg" alt="elreyes"> </div> </a> <a href="/elreyes/made-with-appwrite-appwrite-hackathon-46gn" class="ltag__link__link"> <div class="ltag__link__content"> <h2>Made With Appwrite - Appwrite Hackathon</h2> <h3>Fabian Reyes ・ Apr 14 ・ 1 min read</h3> <div class="ltag__link__taglist"> <span class="ltag__link__tag">#appwritehack</span> <span class="ltag__link__tag">#madewithappwrite</span> <span class="ltag__link__tag">#javascript</span> <span class="ltag__link__tag">#vue</span> </div> </div> </a> </div> appwritehack javascript vue madewithappwrite Fabian Reyes Thu, 14 Apr 2022 18:55:09 +0000 https://forem.com/elreyes/made-with-appwrite-appwrite-hackathon-46gn https://forem.com/elreyes/made-with-appwrite-appwrite-hackathon-46gn <p>I've been using Appwrite for my projects for a while now and I must say that I've always been impressed. Its versatility and ease of use have made me fall in love with it. </p> <p>Despite being a young project its projection is great and today I would like to give back to the team a tool that can help them reach the stars. </p> <h2> What is "Made With Appwrite"? </h2> <p>Made With Appwrite is a web application that allows developers to aggregate their projects created with Appwrite, regardless of what technology they have used.</p> <p>This allows the developer to make their projects visible and the Appwrite team to showcase the wonderful tools that have been built with this tool.</p> <h3> Features: </h3> <ul> <li>User Registration</li> <li>User Login</li> <li>Submit / Edit / Delete Projects</li> <li>Upload files to Storage</li> <li>Create Teams</li> <li>Admin Dashboard</li> <li>Enable / Disable Projects</li> </ul> <h3> Apwrite Services: </h3> <ul> <li>Teams</li> <li>Users</li> <li>Database</li> <li>Locale</li> <li>Storage</li> <li>Account</li> </ul> <h3> Tech Stack: </h3> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Technology</th> <th>Used For</th> </tr> </thead> <tbody> <tr> <td>Vue.Js</td> <td>Frontend</td> </tr> <tr> <td>Appwrite</td> <td>Backend</td> </tr> <tr> <td>Element Ui</td> <td>Style Components</td> </tr> <tr> <td>TypeScript</td> <td>Primary Language</td> </tr> <tr> <td>Pinia</td> <td>State Management</td> </tr> </tbody> </table></div> <h3> Inspiration: </h3> <div class="crayons-card c-embed text-styles text-styles--secondary"> <div class="c-embed__cover"> <a href="https://madewithvuejs.com/" class="c-link s:max-w-50 align-middle" rel="noopener noreferrer"> <img alt="" src="https://res.cloudinary.com/practicaldev/image/fetch/s--2CWhImCO--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://madewithvuejs.com/storage/nova-elements/ldnnBEBfBnsGMZeqiyHJCVwuanqrSZPnsGVtzCoQ.jpeg" height="462" class="m-0" width="880"> </a> </div> <div class="c-embed__body"> <h2 class="fs-xl lh-tight"> <a href="https://madewithvuejs.com/" rel="noopener noreferrer" class="c-link"> Vue.js Showcase - Made With Vue.js </a> </h2> <p class="truncate-at-3"> A collection of projects made with Vue.js – Websites, UI Components, Frameworks, Apps and more! </p> <div class="color-secondary fs-s flex items-center"> <img alt="favicon" class="c-embed__favicon m-0 mr-2 radius-0" src="https://res.cloudinary.com/practicaldev/image/fetch/s--WjnGO34K--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://madewithvuejs.com/mandant/madewithvuejs/favicon/android-icon-192x192.png" width="192" height="192"> madewithvuejs.com </div> </div> </div> <h3> Submission Category: </h3> <p>Maybe Web2 Wizards, can someone please confirm?</p> <h3> Link to Code </h3> <div class="ltag-github-readme-tag"> <div class="readme-overview"> <h2> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--566lAguM--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev.to/assets/github-logo-5a155e1f9a670af7944dd5e12375bc76ed542ea80224905ecaf878b9157cdefc.svg" alt="GitHub logo"> <a href="https://github.com/reyesmfabian"> reyesmfabian </a> / <a href="https://github.com/reyesmfabian/made-with-appwrite"> made-with-appwrite </a> </h2> <h3> An accurate and verified list of production-ready projects made with Appwrite </h3> </div> <div class="ltag-github-body"> <div id="readme" class="md"> <h2> Made with Appwrite ✨ ✨ </h2> <h2> An accurate and verified list of production-ready projects made with Appwrite.</h2> <p>Table of Contents:</p> <ul> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#Requirements">Requirements</a></li> <li> <a href="https://github.com/reyesmfabian/made-with-appwrite#Server-Configuration">Server Configuration</a> <ul> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#Download-Script">Download Script</a></li> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#Project-Configuration">Project Configuration</a></li> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#Run-Script">Run Script</a></li> </ul> </li> <li> <a href="https://github.com/reyesmfabian/made-with-appwrite#Client-Installation">Client Installation</a> <ul> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#Project-Setup">Project Setup</a></li> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#Install-dependencies">Install dependencies</a></li> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#Enter-server-information">Enter server information</a></li> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#Compile-and-hot-reload-for-development">Compile and hot reload for development</a></li> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#Compile-and-minify-for-production">Compile and minify for production</a></li> </ul> </li> <li><a href="https://github.com/reyesmfabian/made-with-appwrite#license">License</a></li> </ul> <h2> Requirements.</h2> <ul> <li>Appwrite Server Instance with version 0.11.1</li> <li>node js 6+</li> <li>npm 14+</li> </ul> <h2> Server Configuration</h2> <h3> Download Script</h3> <div class="snippet-clipboard-content position-relative overflow-auto"><pre class="notranslate"><code class="notranslate">Clone "create_server" folder </code></pre></div> <h3> Project Configuration</h3> <div class="snippet-clipboard-content position-relative overflow-auto"><pre class="notranslate"><code class="notranslate">npm install </code></pre></div> <h3> Run Script</h3> <div class="snippet-clipboard-content position-relative overflow-auto"><pre class="notranslate"><code class="notranslate">npm start </code></pre></div> <ul> <li>Follow the instructions and save the final information</li> </ul> <h2> Client Installation</h2> <h3> Project Setup</h3> <div class="snippet-clipboard-content position-relative overflow-auto"><pre class="notranslate"><code class="notranslate">Cloning the Project </code></pre></div> <h3> Install dependencies</h3> <div class="snippet-clipboard-content position-relative overflow-auto"><pre class="notranslate"><code class="notranslate">npm install </code></pre></div> <h3> Enter server information</h3> <div class="snippet-clipboard-content position-relative overflow-auto"><pre class="notranslate"><code class="notranslate">Edit .env file with server information </code></pre></div> <h3> Compile and hot reload for development</h3> <div class="snippet-clipboard-content position-relative overflow-auto"><pre class="notranslate"><code class="notranslate">npm serve </code></pre></div> <h3> Compile and minify for production</h3> <div class="snippet-clipboard-content position-relative overflow-auto"><pre class="notranslate"><code class="notranslate">npm build </code></pre></div> <h3> License</h3> <p>The source code of the site is licensed under the MIT license, which you can find in the MIT-LICENSE.txt file.</p> </div> </div> <br> <div class="gh-btn-container"><a class="gh-btn" href="https://github.com/reyesmfabian/made-with-appwrite">View on GitHub</a></div> <br> </div> <br> <h3> Additional Resources / Info </h3> <p>The Project is Live !!! </p> <p>Feel free to test it </p> <div class="crayons-card c-embed text-styles text-styles--secondary"> <div class="c-embed__cover"> <a href="https://madewithappwrite.com/" class="c-link s:max-w-50 align-middle" rel="noopener noreferrer"> <img alt="" src="https://res.cloudinary.com/practicaldev/image/fetch/s--yPWObco1--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://res.cloudinary.com/dim6sxove/image/upload/v1650398455/hrfmztyw7dbko2a7qssv.png" height="463" class="m-0" width="880"> </a> </div> <div class="c-embed__body"> <h2 class="fs-xl lh-tight"> <a href="https://madewithappwrite.com/" rel="noopener noreferrer" class="c-link"> Made With Appwrite | Appwrite </a> </h2> <p class="truncate-at-3"> An accurate and verified list of production-ready projects made with Appwrite </p> <div class="color-secondary fs-s flex items-center"> <img alt="favicon" class="c-embed__favicon m-0 mr-2 radius-0" src="https://res.cloudinary.com/practicaldev/image/fetch/s--b7zo2Z5_--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://madewithappwrite.com/img/icons/favicon-32x32.png" width="32" height="32"> madewithappwrite.com </div> </div> </div> appwritehack madewithappwrite javascript vue