SlideShare a Scribd company logo
1 of 17
Download to read offline
GOOGLE DEVELOPER GROUPS
WEB
DEVELOPMENT
& REMOTE
WORK
GDG Hargeisa - Harhub
Ahmed Habib
PRESENTED BY
GDG Hargeisa - Harhub
GDG Hargeisa - Harhub 02
Developer & DBA at Telesom Co.
Co-Founder - CTO at Bluutek Solutions
Instructor at Tiigsi Technology
AHMED HABIB
1 Web Development - React
2 Remote Work
AGENDA
The purpose of the Event is to encourage and
gathering young professionals with technology
talents to foster learning, networking, and
information exchange.
GDG Hargeisa - Harhub
REACT JS
React is a front-end Javascript
library for building user
interfaces.
EASY TO UNDERSTAND
EXCELLENT CROSS-PLATFORM SUPPORT
FANTASTIC COMMUNITY
MOST LOVED LIBRARY
Compared to other frontend frameworks, the
React code is easier to maintain and is flexible
due to its modular structure. This flexibility, in
turn, saves a huge amount of time and cost to
businesses
Most Usage Web Framework
occurding to Javascript Language
05
MOST POPULAR
AND WANT
GDG Hargeisa - Harhub
Javascript
PRE-REQUISITE TO
LEARN REACTJS
GDG Hargeisa - Harhub
Functional Class Based
Functional components are functions that takes
in props and return JSX. They do not natively
have state or lifecycle methods, but this
functionality can be added by implementing
React Hooks. Functional components are usually
used to display information. They are easy to
read, debug, and test
Class components have previously been the
most commonly used among the four
component types. This is because class
components are able to do everything a
functional component do but more. It can utilize
the main functions of React, state, props, and
lifecycle methods. Unlike functional
components, class components are consist of …
well, a class.
07
TYPES OF REACTJS
COMPONENTS
What are React Components?
React components are independent and reusable code. They are the
building blocks of any React application. Components serve the
same purpose as JavaScript functions, but work individually to return
JSX code as elements for our UI. Components usually come in two
types, functional components and class components, but today we
will also be talking about pure components and higher-order
components.
GDG Hargeisa - Harhub
1 Structure of Reactjs
2 Components
3 Props
4 Events
5 Hooks [useState, useEffect]
6 Routing
7 Q&A
CONTENT
GDG Hargeisa - Harhub
Manually setting up all the
things using webpack and
babel
Using the create-react-app
command
Using the create vite command
Ways of creating react app
REACT ENVIRONMENT SET UP
Click this button
more info
npm create-react-app my-app
npm create vite
09
GDG Hargeisa - Harhub
Remote work is the practice of employees doing their
jobs from a location other than a central office operated
by the employer. Such locations could include an
employee's home, a co-working or other shared space, a
private office, or any other place outside of the traditional
corporate office building or campus.
A ROADMAP TO GET
A REMOTE JOB
GDG Hargeisa - Harhub
1 TIPS AND TRICKS
2 Web Developer skills
3 Web Developer Skills for a Remote Environment
CONTENT
Use links to go to a different page inside your presentation.
Highlight text, click on the link symbol on the toolbar, and
select the page in your presentation you want to connect.
GDG Hargeisa - Harhub
Someone who wants to work remotely
TIPS AND TRICKS
Define the type of job you want to do remotely
Gain remote work skills
Be more visible online
Apply for remote jobs
12
GDG Hargeisa - Harhub
Having the right set of web
developer skills is essential to
success in this profession. Though
the exact skills needed for someone
in this profession will vary by
company, the overall skillset web
developers need are the same.
WEB
DEVELOPER
SKILLS
HTML and CSS JavaScript
SEO
JS Frameworks and
Libraries
Back-end Testing and Debugging
Git
Algorithm and data
structure
GDG Hargeisa - Harhub
1 Strong communication skills
2 Problem-solving skills
3 Time management
4 Teamwork
WEB DEVELOPER
SKILLS FOR A REMOTE
ENVIRONMENT
GDG Hargeisa - Harhub
THE BEST SITES
FOR FINDING
REMOTE WORK
ONLINE
Turing
Toptal
Indeed
Crossover
16
The principle "KISS", Keep it Simple Stupid
When you are learning something new, don't
just loads of tutorials aka "tutorial hell", get
hands-on, start doing labs and practice!
BONUS
GDG Hargeisa - Harhub
17
THANK YOU!
Don’t Be Afraid to Ask for Help or to
Help People Back
GDG Hargeisa - Harhub

More Related Content

Similar to GDG Google Developer Groups Chapter 4.pdf

Technical Profile-TejasPatel-UI-Oct2016
Technical Profile-TejasPatel-UI-Oct2016Technical Profile-TejasPatel-UI-Oct2016
Technical Profile-TejasPatel-UI-Oct2016
Tejas Patel
 

Similar to GDG Google Developer Groups Chapter 4.pdf (20)

CV - Pankaj Panwar
CV - Pankaj PanwarCV - Pankaj Panwar
CV - Pankaj Panwar
 
How to Hire React Native Developers: Extended Guide For Executives
How to Hire React Native Developers: Extended Guide For ExecutivesHow to Hire React Native Developers: Extended Guide For Executives
How to Hire React Native Developers: Extended Guide For Executives
 
How backbone.js is different from ember.js?
How backbone.js is different from ember.js?How backbone.js is different from ember.js?
How backbone.js is different from ember.js?
 
How Much Does It Cost To Hire Full Stack Developer In 2022.pdf
How Much Does It Cost To Hire Full Stack Developer In 2022.pdfHow Much Does It Cost To Hire Full Stack Developer In 2022.pdf
How Much Does It Cost To Hire Full Stack Developer In 2022.pdf
 
Technical Profile-TejasPatel-UI-Oct2016
Technical Profile-TejasPatel-UI-Oct2016Technical Profile-TejasPatel-UI-Oct2016
Technical Profile-TejasPatel-UI-Oct2016
 
CV
CVCV
CV
 
Technologies A MERN Stack Developer Should Learn in 2022.pptx
Technologies A MERN Stack Developer Should Learn in 2022.pptxTechnologies A MERN Stack Developer Should Learn in 2022.pptx
Technologies A MERN Stack Developer Should Learn in 2022.pptx
 
Top 5 React Development Companies in the USA - List is Out!.pptx
Top 5 React Development Companies in the USA - List is Out!.pptxTop 5 React Development Companies in the USA - List is Out!.pptx
Top 5 React Development Companies in the USA - List is Out!.pptx
 
Top Backend Frameworks for Mobile App Development in 2023
Top Backend Frameworks for Mobile App Development in 2023Top Backend Frameworks for Mobile App Development in 2023
Top Backend Frameworks for Mobile App Development in 2023
 
How to Hire Reactjs Developers in 2023: Factors to consider
How to Hire Reactjs Developers in 2023: Factors to considerHow to Hire Reactjs Developers in 2023: Factors to consider
How to Hire Reactjs Developers in 2023: Factors to consider
 
10 Best Front-end Frameworks for Web Development
10 Best Front-end Frameworks for Web Development10 Best Front-end Frameworks for Web Development
10 Best Front-end Frameworks for Web Development
 
Why Businesses Should Hire React Native Developers to Build the Best Mobile A...
Why Businesses Should Hire React Native Developers to Build the Best Mobile A...Why Businesses Should Hire React Native Developers to Build the Best Mobile A...
Why Businesses Should Hire React Native Developers to Build the Best Mobile A...
 
Top 7 skills to look into react js developer
Top 7 skills to look into react js developerTop 7 skills to look into react js developer
Top 7 skills to look into react js developer
 
Ashu_Resume
Ashu_ResumeAshu_Resume
Ashu_Resume
 
RESUME
RESUMERESUME
RESUME
 
RESUME
RESUMERESUME
RESUME
 
Template for zama
Template for zamaTemplate for zama
Template for zama
 
Web summit.pptx
Web summit.pptxWeb summit.pptx
Web summit.pptx
 
Hire React Remix Top Developers
Hire React Remix Top DevelopersHire React Remix Top Developers
Hire React Remix Top Developers
 
Building a Strong Online Presence: The Essentials of Full Web Development
Building a Strong Online Presence: The Essentials of Full Web DevelopmentBuilding a Strong Online Presence: The Essentials of Full Web Development
Building a Strong Online Presence: The Essentials of Full Web Development
 

Recently uploaded

Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
WSO2
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
panagenda
 

Recently uploaded (20)

DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
 
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
 
CNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In PakistanCNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In Pakistan
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
Cyberprint. Dark Pink Apt Group [EN].pdf
Cyberprint. Dark Pink Apt Group [EN].pdfCyberprint. Dark Pink Apt Group [EN].pdf
Cyberprint. Dark Pink Apt Group [EN].pdf
 
Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024
 
Ransomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdfRansomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdf
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
 
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 

GDG Google Developer Groups Chapter 4.pdf

  • 1. GOOGLE DEVELOPER GROUPS WEB DEVELOPMENT & REMOTE WORK GDG Hargeisa - Harhub Ahmed Habib PRESENTED BY GDG Hargeisa - Harhub
  • 2. GDG Hargeisa - Harhub 02 Developer & DBA at Telesom Co. Co-Founder - CTO at Bluutek Solutions Instructor at Tiigsi Technology AHMED HABIB
  • 3. 1 Web Development - React 2 Remote Work AGENDA The purpose of the Event is to encourage and gathering young professionals with technology talents to foster learning, networking, and information exchange. GDG Hargeisa - Harhub
  • 4. REACT JS React is a front-end Javascript library for building user interfaces. EASY TO UNDERSTAND EXCELLENT CROSS-PLATFORM SUPPORT FANTASTIC COMMUNITY MOST LOVED LIBRARY
  • 5. Compared to other frontend frameworks, the React code is easier to maintain and is flexible due to its modular structure. This flexibility, in turn, saves a huge amount of time and cost to businesses Most Usage Web Framework occurding to Javascript Language 05 MOST POPULAR AND WANT GDG Hargeisa - Harhub
  • 7. Functional Class Based Functional components are functions that takes in props and return JSX. They do not natively have state or lifecycle methods, but this functionality can be added by implementing React Hooks. Functional components are usually used to display information. They are easy to read, debug, and test Class components have previously been the most commonly used among the four component types. This is because class components are able to do everything a functional component do but more. It can utilize the main functions of React, state, props, and lifecycle methods. Unlike functional components, class components are consist of … well, a class. 07 TYPES OF REACTJS COMPONENTS What are React Components? React components are independent and reusable code. They are the building blocks of any React application. Components serve the same purpose as JavaScript functions, but work individually to return JSX code as elements for our UI. Components usually come in two types, functional components and class components, but today we will also be talking about pure components and higher-order components. GDG Hargeisa - Harhub
  • 8. 1 Structure of Reactjs 2 Components 3 Props 4 Events 5 Hooks [useState, useEffect] 6 Routing 7 Q&A CONTENT GDG Hargeisa - Harhub
  • 9. Manually setting up all the things using webpack and babel Using the create-react-app command Using the create vite command Ways of creating react app REACT ENVIRONMENT SET UP Click this button more info npm create-react-app my-app npm create vite 09 GDG Hargeisa - Harhub
  • 10. Remote work is the practice of employees doing their jobs from a location other than a central office operated by the employer. Such locations could include an employee's home, a co-working or other shared space, a private office, or any other place outside of the traditional corporate office building or campus. A ROADMAP TO GET A REMOTE JOB GDG Hargeisa - Harhub
  • 11. 1 TIPS AND TRICKS 2 Web Developer skills 3 Web Developer Skills for a Remote Environment CONTENT Use links to go to a different page inside your presentation. Highlight text, click on the link symbol on the toolbar, and select the page in your presentation you want to connect. GDG Hargeisa - Harhub
  • 12. Someone who wants to work remotely TIPS AND TRICKS Define the type of job you want to do remotely Gain remote work skills Be more visible online Apply for remote jobs 12 GDG Hargeisa - Harhub
  • 13. Having the right set of web developer skills is essential to success in this profession. Though the exact skills needed for someone in this profession will vary by company, the overall skillset web developers need are the same. WEB DEVELOPER SKILLS HTML and CSS JavaScript SEO JS Frameworks and Libraries Back-end Testing and Debugging Git Algorithm and data structure GDG Hargeisa - Harhub
  • 14. 1 Strong communication skills 2 Problem-solving skills 3 Time management 4 Teamwork WEB DEVELOPER SKILLS FOR A REMOTE ENVIRONMENT GDG Hargeisa - Harhub
  • 15. THE BEST SITES FOR FINDING REMOTE WORK ONLINE Turing Toptal Indeed Crossover
  • 16. 16 The principle "KISS", Keep it Simple Stupid When you are learning something new, don't just loads of tutorials aka "tutorial hell", get hands-on, start doing labs and practice! BONUS GDG Hargeisa - Harhub
  • 17. 17 THANK YOU! Don’t Be Afraid to Ask for Help or to Help People Back GDG Hargeisa - Harhub