Welcome to Modern Tutorials

Here you will learn modern web development and automation testing.

Web development Courses

Languages

Web Automation Testing Courses

Native app Automation Testing Courses

Dektop app automation Testing Courses

Other Courses

Interview Task

  • Do not copy the projects as it is from internet
  • Create a sample project on 2 tech stacks
  • Create a private repo and send me invite as a collaborator
  • Create markdown .md file in repo and Write a technical documentation of the project
  • You should be able to explain how project works
  • Once you are ready, send me google meet invite and we will go through the project

Task 1 - Simple Tech Stack

  1. Splunk + Elasticsearch + Kibana - Create a simple webapp and integrate any of these logging technologies in that app and also write technical documentation.
  2. logrocket + datadog + sentry - Create a simple webapp and integrate any of these logging technologies in that app and also write technical documentation.
  3. google analytics + storybookjs + fullstory + SEO - Explain how to integrate google analytics in a website and how to optimise site for better SEO and also write technical documentation.
  4. svelte or vue.js - Create a simple app in any of these frameworks and also write technical documentation.
  5. JAM Stack e.g. netlify/strapi/contentful/vercel - Create a simple app using JAM Stack and also write technical documentation.
  6. icons + stylus + SASS + css frameworks+ material ui + material design + formik + ant design + js libraries e.g. JQuery- Explain how to use icons like fontawesome, hero icons in website, how to use css frameworks like bootstrap, tailwind and write about top 10 popular JS libraries.
  7. html/css themes - wordpress/strapi/drupal/joomla themes/themeforest/shopify themes/template monster/codecanyon themes
  8. Create 2 calculator apps like mortgage calculator, home equity calculator, stamp duty and loan repayment e.g. https://www.nab.com.au/personal/home-loans/calculators/loan-repayments-calculator
  9. Plugins - wordpress plugins, etsy, squarespace, wix, woocommerce, bigcommerce plugins, shopify plugins
  10. Cloud services - AWS, Google Cloud, Azure, Heroku, Digital Ocean - Explain main features of these cloud providers, what free services are provided by them, How to choose the cloud service provider etc. Write detailed documentation.
  11. OWASP - web security standards - Explain in detail and write how to implement in typical website.
  12. Find out about top open source projects from google, microsoft, facebook, apple, amazon, netflix, apache and write technical documentation.
  13. Explain devops roles and responsibilities with examples of containers, orchestrations, ansible, puppet or chef.

Task 2 - Complex Tech Stack

  1. Develop game using JavaScript
  2. Create web scraping project to get stock data
  3. Develop a react app to perform image manipulation using any image manipulation library e.g. cropping, resizing, image filters, remove image background, creating passport size photo, image collage.
  4. Create a simple web app using Webassembly and pyscript in html
  5. Rapidapi or fastAPI - Develop an API and publish on RapidAPI and also write technical documentation.
  6. C#.net + web app + MSSQL + azure - Develop any .net based web app and also write technical documentation.
  7. php + laravel + Redis + digitalocean - Develop a web app in php and laravel along with redis and deploy on digital ocean free plan and also write technical documentation.
  8. Firebase/amplify/supabase/postgress - Develop a web app using any of this tech and write technical documentation.
  9. Flutter + Ionic + react native + xamarin + electron - Create an app using any of these technologies.
  10. Docker + k8 + scale app - Create a simple web app using dockers and kubernetes and also write technical documentation.
  11. Java + web app + Cassandra - Create a simple web app using Java, Cassandra and also write technical documentation.
  12. Dart + kotlin + go + rust + deno - Create a simple app using any of these technologies and and also write technical documentation.
  13. Swift + Objective C + Xcode - Create a simple app using any of these technologies and and also write technical documentation.
  14. nextjs + vercel + prisma - Create a simple app using these technologies and and also write technical documentation.
  15. nextjs + mdx and md blog - Create a simple blog app using these technologies and and also write technical documentation.
  16. MEAN - mongodb + express + angular + aws + lambda functions
  17. WAMP/LAMP - wordpress, apache, mysql, php
  18. React app with graphql and apollo client
  19. Explain deployment process and how Pipelines are used to deploy the projects e.g. How to deploy the app from Jenkins to Nginx or tomcat server. You need to setup the project and write technical documentation

Upcoming changes

  • Image editor online - tensorflow, sharp, cropperjs, jimp, image-js, https://sharp.pixelplumbing.com/ , https://github.com/lovell/sharp, crop, resize, jpg to png, background removal, tensorflow
  • pdf converters and compressers
  • Layouts, Themes - https://lmpixels.com/demo/breezycv/light/1/index.html#about-me, https://lmpixels.com/demo/breezycv/dark/1/index.html#home http://exill.dk/demo/kitzu/template/index.html,
  • Plugins -
  • Images for some courses on cc express
  • max width - pre
  • test links of tutorials
  • make sure posttop and bottom component is added in all tutorials
  • Internships pages in console
  • Final year project sponsorship in console
  • Theme marketplace
  • Email from amazon
  • Cloud and coding channel - email address - check drafts
  • Technical Tutorial using md syntax
  • Tutorial - C, C++, JS, HTML, CSS, react, django, python, robotframework, angular
  • Website testing
  • Landing page
  • VScode, intellij, laravel, django, flask
  • why image 100% not working
  • Setting up react/express project
  • Setting up nextjs project
  • Video Tutorial - react, JS, angular, prisma, google workspace + use powerdirector
  • md to website using static props in nextjs
  • Calculator site - e.g. https://www.rapidtables.com/calc/index.html or https://www.thecalculatorsite.com/ - finance, metric conversion calculators
  • dev utilities - https://www.rapidtables.com/tools/index.html e.g. json schema generator, xml viewer, base64, url encode, image to base64, markdown to html, base64 to image, https://codebeautify.org/
  • JS for web development - utitlies like go to top, social media etc
  • Maths - https://www.rapidtables.com/math/index.html
  • Electrical engineers - https://www.rapidtables.com/electric/index.html
  • Unit Converters - https://www.rapidtables.com/convert/index.html
  • Thumbnail makers, Image compressers - https://imagecompressor.com/ and https://compressjpeg.com/ and collage makers
  • Video - ffmpeg and jimp - compress video, video converter, gif maker
  • Website layouts
  • Servers - nginx, apache, express, nextjs server
  • Databases - mysql, mongodb, prisma, postgress
  • Clouds - aws, google cloud, azure
  • Free logo making - https://www.freelogo.me/
  • Roles - Tester, Devops engineer, Cloud architect, full stack engineer, Front end dev, back end dev
  • Branded APIs - FB api, github api, Google APIs
  • https://web.dev/rendering-on-the-web/
  • https://codebeautify.org/

Advanced Upcoming changes

  • Full SSL + Cloudflare - needs upgrade of dynos
  • Disuqs comments removed as it was slowing down site and calling 3rd party websites
  • Contact Us + captcha + email + mongodb
  • Sign in link + mongodb
  • Stripe live keys - register for live training
  • Oauth credentials
  • Next-Auth variable
  • Sign out function

Interview Preparation

Some important links