Web Development In 2018
Download as PPTX, PDF7 likes2,754 views
We are about to start a new year and I have put together a guide for current and aspiring web developers to follow to get an idea of what it takes to be a full stack developer. From basic tools to html/css, JavaScript, UI frameworks like Bootstrap, server side technologies like Node.js, Python and PHP, frameworks like Laravel, Django and Ruby on Rails. I tried to include the most used technologies and give you the options to choose from with some of my own opinion and input.
![2
Before We Start…
This is a guide to web development technologies and your options
Based on both fact and opinion
Look other places for guidance, not just this video
Decide what type of developer you want to be before anything
[Full stack developer, front-end, web designer, back-end engineer &
API creation]
Traversymedia.com](https://image.slidesharecdn.com/webdevelopmentin2018-180131161612/85/Web-Development-In-2018-2-320.jpg)
![5
Basic Vanilla JavaScript
Basic JS [NO FRAMEWORKS!]
Data types, functions, conditionals, loops, operators, etc
DOM manipulation & events [NO JQUERY!]
Ajax / Fetch API / JSON
ES2015+ (Arrow functions, promises, template strings)
Traversymedia.com](https://image.slidesharecdn.com/webdevelopmentin2018-180131161612/85/Web-Development-In-2018-5-320.jpg)
![6
Deploying a Basic Website
Shared hosting [InMotion, Hostgator, etc]
Learn the basics of cPanel [Creating email accounts, FTP,
etc]
Upload a site with FTP [FileZilla]
Register a domain name and learn about DNS / Name
Servers
Traversymedia.com](https://image.slidesharecdn.com/webdevelopmentin2018-180131161612/85/Web-Development-In-2018-6-320.jpg)
![8
Where To Next? [Depends]
HTML / CSS Frameworks Bootstrap, Materialize, etc
Frontend JavaScript Framework React, Angular, etc
Server Side Language / Technology Node.js, Python, etc
Database MongoDB, MySQL, etc
Traversymedia.com](https://image.slidesharecdn.com/webdevelopmentin2018-180131161612/85/Web-Development-In-2018-8-320.jpg)
![9
HTML / CSS Frameworks [Choose One]
Twitter Bootstrap 4 General framework, most popular
Materialize CSS Primarily a UI/UX framework
Bulma Easy to learn syntax, No JS
Zurb Foundation Alternative to Bootstrap
Skeleton VERY light boilerplate
Traversymedia.com](https://image.slidesharecdn.com/webdevelopmentin2018-180131161612/85/Web-Development-In-2018-9-320.jpg)
![10
Front End JS Framework [Choose One]
React Popular for startups, fast, Redux, JSX
Angular Popular in enterprise, full featured, NgRx
Vue.js Fast, light, easy to use, Vuex
Aurelia Light, feels like vanilla JavaScript
Traversymedia.com](https://image.slidesharecdn.com/webdevelopmentin2018-180131161612/85/Web-Development-In-2018-10-320.jpg)
![12
Server Side Technology [Choose One]
Node.js Fast, scalable and powerful
Python Popular, rapid development, great integration
PHP Practical, easy to deploy – Wordpress & Laravel
Ruby Rapid development, strong community
C# & ASP.NET Very powerful, Microsoft
Traversymedia.com](https://image.slidesharecdn.com/webdevelopmentin2018-180131161612/85/Web-Development-In-2018-12-320.jpg)
![13
Database [Choose One]
MongoDB NoSQL, non-relational, suggested for Node.js
MySQL Popular relational database
PostgreSQL Powerful but a bit more difficult than MySQL
SQL Server Microsoft’s implementation of SQL
Oracle Heavily used in enterprise
Firebase Cloud database maintained by Google
Traversymedia.com](https://image.slidesharecdn.com/webdevelopmentin2018-180131161612/85/Web-Development-In-2018-13-320.jpg)
![14
Server Side Frameworks [Choose One]
JavaScript Express, Hapi.js, Adonis, Loopback, Swagger
Python Django, Flask, Web2py, Pylons
PHP Laravel, Symfony, CodeIgniter, Yii2
Ruby Ruby on Rails, Sinatra, Nitro
C# .NET
Traversymedia.com](https://image.slidesharecdn.com/webdevelopmentin2018-180131161612/85/Web-Development-In-2018-14-320.jpg)
![15
Content Management Systems
Wordpress, Drupal, Joomla [PHP]
Great for clients
Thousands of plugins / addons
Fast development
Can be limiting
Traversymedia.com](https://image.slidesharecdn.com/webdevelopmentin2018-180131161612/85/Web-Development-In-2018-15-320.jpg)
![17
Mobile Applications [Choose One]
React Native
NativeScript
Ionic
PhoneGap / Cordova
Xamarin
Traversymedia.com](https://image.slidesharecdn.com/webdevelopmentin2018-180131161612/85/Web-Development-In-2018-17-320.jpg)
![18
You Are a Full Stack Developer!
Create simple to advanced web applications [Front & Back end]
Create secure REST APIs
Deploy & maintain applications
Administer databases
• You should now be able to get a very good job or run your own business
Traversymedia.com](https://image.slidesharecdn.com/webdevelopmentin2018-180131161612/85/Web-Development-In-2018-18-320.jpg)
![19
Biggest Changes From Last Year
New technologies [Grid CSS, Fetch API, Materialize, NativeScript]
More focus on full stack and REST APIS rather than server rendered
views
More focus on vanilla JavaScript in addition to frameworks
Single Page Applications
Python & C# over PHP
Traversymedia.com](https://image.slidesharecdn.com/webdevelopmentin2018-180131161612/85/Web-Development-In-2018-19-320.jpg)
Ad
More Related Content
What's hot (20)
Similar to Web Development In 2018 (20)
Ad
Recently uploaded (20)
Ad
Web Development In 2018
- 1. 1 Web Development In 2018 Traversymedia.com A Practical Guide
- 2. 2 Before We Start… This is a guide to web development technologies and your options Based on both fact and opinion Look other places for guidance, not just this video Decide what type of developer you want to be before anything [Full stack developer, front-end, web designer, back-end engineer & API creation] Traversymedia.com
- 3. 3 Tools & Software Text Editor VSCode, Atom, Sublime Text Good Browser Chrome or Firefox Image Editing Photoshop, GIMP, etc Deployment Tools FTP client, SSH tool Cloud Storage Optional Dropbox, Google Drive, etc Traversymedia.com
- 4. 4 HTML / CSS Learn before ANYTHING else Building blocks of the web Every website uses both Easy & quick to learn Learn the core fundamentals & basics of Flex and/or Grid Responsive layouts are VERY important Traversymedia.com
- 5. 5 Basic Vanilla JavaScript Basic JS [NO FRAMEWORKS!] Data types, functions, conditionals, loops, operators, etc DOM manipulation & events [NO JQUERY!] Ajax / Fetch API / JSON ES2015+ (Arrow functions, promises, template strings) Traversymedia.com
- 6. 6 Deploying a Basic Website Shared hosting [InMotion, Hostgator, etc] Learn the basics of cPanel [Creating email accounts, FTP, etc] Upload a site with FTP [FileZilla] Register a domain name and learn about DNS / Name Servers Traversymedia.com
- 7. 7 Web Designer / Basic Front End Dev Build simple websites & UIs PSD / AI -> HTML / CSS Some dynamic UI with JavaScript Choose to be a freelancer or a very entry level position Traversymedia.com
- 8. 8 Where To Next? [Depends] HTML / CSS Frameworks Bootstrap, Materialize, etc Frontend JavaScript Framework React, Angular, etc Server Side Language / Technology Node.js, Python, etc Database MongoDB, MySQL, etc Traversymedia.com
- 9. 9 HTML / CSS Frameworks [Choose One] Twitter Bootstrap 4 General framework, most popular Materialize CSS Primarily a UI/UX framework Bulma Easy to learn syntax, No JS Zurb Foundation Alternative to Bootstrap Skeleton VERY light boilerplate Traversymedia.com
- 10. 10 Front End JS Framework [Choose One] React Popular for startups, fast, Redux, JSX Angular Popular in enterprise, full featured, NgRx Vue.js Fast, light, easy to use, Vuex Aurelia Light, feels like vanilla JavaScript Traversymedia.com
- 11. 11 Side Technologies You Should Learn GIT Version control Basic Command Line Folder navigation, file creation, etc APIS / REST Learn how REST APIs work HTTP / SSL HTTP requests, HTTPS CSS Pre-Processor Sass or Less Webpack & Babel Module loader & JS compiler Traversymedia.com
- 12. 12 Server Side Technology [Choose One] Node.js Fast, scalable and powerful Python Popular, rapid development, great integration PHP Practical, easy to deploy – Wordpress & Laravel Ruby Rapid development, strong community C# & ASP.NET Very powerful, Microsoft Traversymedia.com
- 13. 13 Database [Choose One] MongoDB NoSQL, non-relational, suggested for Node.js MySQL Popular relational database PostgreSQL Powerful but a bit more difficult than MySQL SQL Server Microsoft’s implementation of SQL Oracle Heavily used in enterprise Firebase Cloud database maintained by Google Traversymedia.com
- 14. 14 Server Side Frameworks [Choose One] JavaScript Express, Hapi.js, Adonis, Loopback, Swagger Python Django, Flask, Web2py, Pylons PHP Laravel, Symfony, CodeIgniter, Yii2 Ruby Ruby on Rails, Sinatra, Nitro C# .NET Traversymedia.com
- 15. 15 Content Management Systems Wordpress, Drupal, Joomla [PHP] Great for clients Thousands of plugins / addons Fast development Can be limiting Traversymedia.com
- 16. 16 Dev Ops & Deploying Applications Dedicated Server / VPS Cloud Hosting – Digital Ocean, Heroku, Amazon Web Services Cloud Storage – Amazon S3 Working with SSH & command line Server maintenance & software updates Traversymedia.com
- 17. 17 Mobile Applications [Choose One] React Native NativeScript Ionic PhoneGap / Cordova Xamarin Traversymedia.com
- 18. 18 You Are a Full Stack Developer! Create simple to advanced web applications [Front & Back end] Create secure REST APIs Deploy & maintain applications Administer databases • You should now be able to get a very good job or run your own business Traversymedia.com
- 19. 19 Biggest Changes From Last Year New technologies [Grid CSS, Fetch API, Materialize, NativeScript] More focus on full stack and REST APIS rather than server rendered views More focus on vanilla JavaScript in addition to frameworks Single Page Applications Python & C# over PHP Traversymedia.com
- 20. 20 What Now? Focus on your career and whatever technologies your company uses Learn other languages / stacks in your spare time Stay up to date with trends & technologies Traversymedia.com
- 21. 21 Follow Me TWITTER: Twitter.com/traversymedia FACEBOOK: Facebook.com/traversymedia INSTAGRAM: Instagram.com/traversymedia DISCORD CHAT: Discord.gg/traversymedia LINKEDIN: Linkedin.com/in/bradtraversyTraversymedia.com