The latest articles on Forem by Justify Agency (@justifyagencyhq). https://forem.com/justifyagencyhq 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%2Forganization%2Fprofile_image%2F2344%2Fdee180c4-69c0-452d-9740-4a903936e1fe.png https://forem.com/justifyagencyhq en Aashir Khan Tue, 26 May 2020 19:20:12 +0000 https://forem.com/justifyagencyhq/official-website-is-live-built-with-tailwindcss-and-alpinejs-and-lots-of-2een https://forem.com/justifyagencyhq/official-website-is-live-built-with-tailwindcss-and-alpinejs-and-lots-of-2een <p>This is the official website of Justify Agency, built with lots of patience, design work and 💖</p> <p>Repo: <a href="https://github.com/justifyagencyhq/Official-Website">GitHub Public</a></p> <p>Watch the Video: <br> <iframe width="710" height="399" src="https://www.youtube.com/embed/u_IXJnnJZ-Q"> </iframe> </p> <p>Visit it here: <a href="https://justifyagency.com">Click here</a></p> <h2> Technologies Used </h2> <ul> <li> <a href="https://tailwindcss.com">TailwindCSS</a>: We love this framework a lot, and we are absolutely not going away from it. It's fast, scalable, easy-to-use. We used it, at first it looks like that it's too heavy but after compilation, our CSS Size is only 3KB 🤯</li> <li> <a href="https://github.com/alpinejs/alpine">AlpineJS</a>: We don't like to play with DOM Selectors anymore, even for simpler things + We are using VueJS every day, so it's a deal-deal</li> <li> <a href="https://parceljs.org/">Parcel</a>**: It's Simple, that's it</li> <li> <a href="https://ionicons.com/">IonIcons</a>: This is completely biased, our cat loves it so 😍</li> <li> <a href="https://www.netlify.com/">Netlify</a>: It's simple, with Free SSL + Auto-Deployment. We can roll-back easily and we're also using built-in form collector.</li> <li> <a href="https://mciastek.github.io/sal/">Sal.js</a>: Lightweight scroll animation library (Zero Dependencies) and it's just super minimal.</li> <li> <a href="https://github.com">GitHub</a>: It's free for teams now so 🥳</li> <li> <a href="https://www.favicon-generator.org/">Favicons</a> - It worked for us, and provided us the zip file of different sizes</li> </ul> <h2> Page Speed Insights </h2> <h3> Desktop </h3> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--Jf5npPhs--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://imagehost.imageupload.net/2020/05/26/image750914807bb710e1.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--Jf5npPhs--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://imagehost.imageupload.net/2020/05/26/image750914807bb710e1.png" alt="Desktop Score" width="880" height="437"></a></p> <h3> Mobile </h3> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--OVlaOgBm--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://imagehost.imageupload.net/2020/05/26/image9a5c2c8e388861e6.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--OVlaOgBm--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://imagehost.imageupload.net/2020/05/26/image9a5c2c8e388861e6.png" alt="Mobile Score" width="880" height="435"></a></p> <h3> Some Credits: </h3> <p><a href="https://freepik.com">FreePik</a> - Thanks for Illustrations</p> <p>We are ready for the Launch!<br> Follow us on <a href="https://twitter.com/justifyagencyhq">Twitter</a></p> css design beginners webdev