CT-WP02
معسكر تصميم وبرمجة الواجهة الأمامية لتطبيقات ومواقع الويب
Front End design and development bootcamp
معسكر تصميم وبرمجة الواجهة الأمامية لتطبيقات ومواقع الويب

باستخدام تقنيات

HTML - CSS - JavaScript - ReactJS

Using technologies

مطور مواقع الويب - مصمم مواقع الويب - مطور تطبيقات الويب - مصمم تطبيقات الويب - مطور الواجهة الأمامية لمواقع وتطبيقات الويب - مطور مواقع الويب باستخدام React JS
web developer - web designer - web application developer - web application designer - front end web application developer - web developer using React JS

7

المواد

متقدم

المستوى

عربي

اللغة

02:33

المدة

مجاناً

السعر

"مصمم ومبرمج الواجهة الأمامية"

هذا ما ستكون عليه بعد دراستك لهذا المعسكر !

يهدف هذا المعسكر إلى إعداد مصممين ومبرمجين محترفين للواجهة الأمامية لمواقع وتطبيقات الويب، وأن تكون لديهم القدرة على تصميم وبناء تطبيقات ويب ضخمة باستخدام أشهر التقنيات HTML - CSS - JavaScript - ReactJS - BootStrap

ما المقصود بالمعسكر التدريبي؟
المعسكر التدريبي يشير إلى مجموعة متسلسلة من الدورات التدريبية المنظمة والمرتبة بعناية، تبدأ معك من الخطوة الأولى في مسيرتك التعليمية وتقودك بثبات نحو الاحتراف.
المعسكر التدريبي يعني أنك لست بحاجة إلى أي معرفة سابقة للبدء، وبعد ذلك لن تحتاج إلى أي دورات إضافية للوصول إلى هدفك التعليمي واقتحام سوق العمل!

لماذا معسكر كلوز تاج التدريبي؟
مع تعدد التقنيات والتكنولوجيا المستخدمة، ومع وجود العديد من المناهج والمستويات المختلفة فضلًا عن الكثير من المصطلحات والأسماء المعقدة؛ فإن أكبر عقبة تواجه الراغبين في دخول هذا المجال هي تحديد الطريق بشكل واضح.
من أين أبدأ وكيف أصل أو ما هي الخطوات الصحيحة للوصول؟! هذا هو السؤال الأكثر شيوعًا لدى معظم المتدربين، ولأن لدينا الخبرة الكافية للإجابة على هذا السؤال فقد قمنا بإنشاء هذا المعسكر ليضعك على الطريق الصحيح من البداية وبالترتيب المناسب.

ما الذي لدى كلوز تاج هنا في هذا المعسكر؟
من هنا يمكنك البدء بالخطوة الأولى، ثم الانطلاق مع 7 دورات رئيسية تحتوي كل منها على العديد من الموضوعات الفرعية، هذا بالإضافة إلى بعض الميزات الأخرى على هامش المعسكر التدريبي.
معسكر تصميم وبرمجة الواجهة الأمامية لتطبيقات ومواقع الويب

يستعرض هذا المعسكر التدريبي ست دورات أساسية في مجال تصميم وبرمجة الواجهة الأمامية لمواقع وتطبيقات الويب من خلال خبراء متخصصون
في هذا المجال لديهم الخبرة الكافية في سوق العمل لينقلوا لك صورة كاملة أكاديمية وعملية عن هذا التخصص بجميع تفاصيله من زاوية الحياة العملية
لتحصل على رؤية واضحة عن مجال تصميم وبرمجة مواقع وتطبيقات الويب قبل الدخول فيه..

وفي كل مرحلة من مراحل هذا المعسكر سيتم توجيهك خطوة بخطوة بدايةً من دراسة المواد الأساسية وعمل التطبيقات حتى تكتسب الآتي:

  • فهمًا متكاملًا للواجهة الأمامية لمواقع وتطبيقات الويب
  • القدرة على حل المشكلات والعقبات
  • القدرة على تصميم الواجهة الأمامية لمواقع وتطبيقات ويب حقيقية
  • القدرة على برمجة الواجهة الأمامية لمواقع وتطبيقات الويب
  • الخبرة في عمل المشاريع الحقيقية
  • الخبرة في التعاون والعمل ضمن فريق عمل
  • سابقة أعمال احترافية

وليس هذا فحسب، إننا هنا لا نتحدث عن شروحات نظرية فقط، بل سنقدم لك تجربة العمل في هذا المجال حتى تتأكد بنفسك من مدى قابليتك للعمل في المجال أو التخصص الذي قمت باختياره، ولذلك نوفر لك تدريبًا عمليًا ميدانيًا في هذا المعسكر والذي سيضيف إليك أيضًا الكثير من المهارات الفنية والشخصية التي ستحتاج إليها وتستعملها لاحقًا في سوق العمل.

يتضمن المعسكر أيضًا قسمًا مختصًا بالمهارات الشخصية في مجال العمل؛ مثل تنظيم الوقت، والتسويق الشخصي، وكيفية كتابة سيرة ذاتية احترافية لمجال برمجة وتطوير الواجهة الخلفية لمواقع وتطبيقات الويب، وكيفية الاستعداد للمقابلة الشخصية أو للقاء العميل، وما ينبغي عليك ذكره في مقابلتك الشخصية وماينبغي عليك السكوت عنه سواء في الشركات أو مع عملائك في العمل الحر، وغيرها من الموضوعات الأساسية لتأهيلك للمضي قدمًا في تخصصك المختار.

هذا المعسكر التدريبي هو فرصتك لاختصار شهور وربما سنوات من البحث والدراسة والتجربة لتحصل على دليل شامل وواضح لمسيرتك نحو
مجال تصميم وبرمجة الواجهة الأمامية لمواقع وتطبيقات الويب بناءً على تحليل السوق المصرية والعالمية


المواد التعليمية التي سيتم دراستها في هذا المعسكر

Front-End

تصميم وبرمجة الواجهة الأمامية لمواقع وتطبيقات الويب

1
HTML

HTML

توفر هذه الدورة شرحًا شاملًا للغة HTML الأساسية لبناء الويب، فهي تركز على معرفة كيفية تركيب وتنظيم صفحات الويب باستخدام العناصر الأساسية، مثل: العناوين، والفقرات، والروابط، والصور، كما تغطي المواضيع المتقدمة، مثل: تعلم كيفية تضمين الفيديوهات والمقاطع الصوتية لصفحات الويب.
HTML
HTML Syntax
الدروس

HTML Introduction

HTML Elements

HTML Attributes

HTML
Get Started
الدروس

First HTML Document

Create HTML Document Windows

HTML
HTML Basics
الدروس

HTML Headings

HTML Paragraphs

HTML Comments

HTML Text Formatting

HTML
HTML Links
الدروس

HTML Links

HTML Link Attributes

HTML Hyperlinks

HTML Link Types

HTML
HTML Images
الدروس

HTML Images

HTML Image Maps

HTML Image File Types

HTML File Path

HTML
HTML Tables
الدروس

HTML Tables

HTML Table Attributes

Merge Table Cells html

HTML Table Nested Elements

HTML
HTML Lists
الدروس

HTML Lists

HTML Ordered Lists

HTML Unordered Lists

HTML Description List

HTML Nested List

List Attributes

HTML
HTML Elements
الدروس

HTML Nested Pages - Iframes

HTML Head Element

HTML Meta Tags

HTML
HTML Forms
الدروس

HTML Forms

HTML Form Attributes

HTML Form Text Inputs

HTML Form Buttons Inputs

HTML Form Select Inputs

HTML Form Date and Time Inputs

HTML Form Numbers Inputs

HTML Form files Inputs

HTML Form Input Primary Attributes

HTML Form Input Secondary Attributes

HTML Form Input Advanced Attributes

HTML Form Elements

HTML
HTML Media
الدروس

HTML YouTube

HTML Video

HTML Audio

HTML
HTML Advanced
الدروس

HTML Block and Inline Elements

HTML Semantic Elements

HTML Entities

2
CSS

CSS

تركز مادة CSS على معرفة كيفية التحكم في الألوان والخلفيات وترتيب عناصر HTML على المتصفح بواسطة لغة CSS، فأهم ما يميز هذه اللغة هو تقسيم صفحة الويب إلى أقسام "sections"، وعرض كل section بطريقة منظمة؛ مما يؤدي في النهاية إلى تصميم حديث وجذاب لصفحة الويب.
CSS
CSS Syntax
الدروس

CSS Introduction

CSS Syntax

CSS Selectors

CSS How To

CSS Comments

CSS Important

CSS
CSS Text
الدروس

CSS Text Color

CSS Text Alignment

CSS Vertical Alignment

CSS Text Transformation

CSS Text Spacing

CSS Text White Space

CSS Text Shadow

CSS Text Direction

CSS
CSS Text Decoration
الدروس

CSS Text Decoration Line

CSS Text Decoration Color

CSS Text Decoration thickness

CSS Text Decoration style

CSS Text Decoration Shorthand

CSS
CSS Fonts
الدروس

CSS Font Size

CSS Font Family

CSS Font Style

CSS Font Shorthand

CSS Google Font

CSS
CSS Backgrounds
الدروس

CSS Background Color

CSS Background Image

CSS Background Size

CSS Background Repeat

CSS Background Attachment

CSS Background Position

CSS Background Shorthand

CSS
CSS Borders
الدروس

CSS Borders

CSS Border style

CSS Border Width

CSS Border Color

CSS Border Sides

CSS Border Shorthand

CSS Rounded Borders

CSS
CSS Outline
الدروس

CSS Outline

CSS Outline style

CSS Outline Width

CSS Outline Color

CSS Outline Offset

CSS Outline Shorthand

CSS
CSS Box Model
الدروس

CSS Margin

CSS Padding

CSS Box Sizing

CSS Box Model

CSS
CSS Dimensions
الدروس

CSS Height

CSS Width

CSS Max Height

CSS Min Height

CSS Max Width

CSS Min Width

CSS Calculator

CSS
CSS Position
الدروس

CSS Display

CSS Visibility

CSS Float

CSS Clear

CSS Position

CSS Layers Orders z-index

CSS Overflow

CSS
CSS Style
الدروس

CSS Links

CSS Images

CSS Lists

CSS Tables

CSS Transparency Opacity

CSS
CSS Navigation
الدروس

CSS Navigation Bar

CSS Vertical Navigation Bar

CSS Horizontal Navigation Bar

CSS
CSS Flex Box
الدروس

CSS Flexbox

CSS Flex Direction

CSS Flex Wrap

CSS Flex Flow

CSS flex Justify Content

CSS flex Align Items

CSS flex Align Content

CSS Flex Order

CSS Flex Basis

CSS Flex Grow

CSS Flex Shrink

CSS Flex Align Self

CSS Flex

CSS
CSS Grid System
الدروس

CSS Grid System

CSS Grid Container

CSS Grid Items

CSS
CSS Grid Columns
الدروس

CSS Grid Template Columns

CSS Grid Column Start

CSS Grid Column End

CSS Grid Column

CSS Grid Auto Columns

CSS
CSS Grid rows
الدروس

CSS Grid Template Rows

CSS Grid Row Start

CSS Grid Row End

CSS Grid Row

CSS Grid Auto Rows

CSS Grid Template

CSS
CSS Grid Area
الدروس

CSS Grid Template Areas

CSS Grid Area

CSS
CSS Grid Gaps
الدروس

CSS Grid Row Gap

CSS Grid Gap

CSS Grid Column Gap

CSS
CSS Grid
الدروس

CSS Grid Content

CSS Grid Auto Flow

CSS Repeat Function

CSS
CSS Responsive
الدروس

CSS Responsive Introduction

CSS Responsive Viewport

CSS Media Queries

CSS Media Query Examples

CSS Responsive Grid View

CSS Grid Media Queries

CSS Video Responsive

CSS Image Responsive

CSS Flex Responsive

CSS
CSS Text Effects
الدروس

CSS Text Overflow

CSS Word Wrap

CSS Writing Mode

CSS
CSS Advanced
الدروس

CSS Background Origin

CSS Pagination

CSS Buttons

CSS Column Count

CSS 2D Transforms

CSS 3D Transforms

CSS Transitions

CSS Background Clip

CSS Rounded Corners

CSS Colors

CSS Multiple Backgrounds

CSS Color Keywords

CSS Color Gradients

CSS Border Images

CSS Animations

CSS Tooltip

CSS Variables

CSS Dynamic

CSS
CSS Selectors
الدروس

CSS Combinator selectors

CSS Pseudo Classes

3
JavaScript

JavaScript

تركز مادة JavaScript على تعلم كيفية إضافة وظائف ديناميكية وتفاعلية إلى صفحات الويب، حيث يمكن استخدامها لإضافة تأثيرات حية، مثل: تغيير محتوى الصفحة دون إعادة تحميلها، والتحقق من البيانات المدخلة؛ فمن أهم ما يميز لغة JavaScript هو قدرتها على التفاعل مع عناصر HTML وتغييرها ديناميكيًا.
JavaScript
JavaScript Syntax
الدروس

JavaScript Introduction

JavaScript Where To

JavaScript Output

JavaScript Syntax

JavaScript Comments

JavaScript
JavaScript Store Data
الدروس

JavaScript var Variables

JavaScript Constants

JavaScript let Variables

JavaScript Data Types

JavaScript
JavaScript Operators
الدروس

Java Script Arithmetic Operators

Java Script Increment And Decrement Operators

JavaScript Unary Operators

Operator Precedence in javascript

JavaScript Assignment Operators

JavaScript Comparison Operators

JavaScript Logical Operators

JavaScript Bitwise Operators

Java Script Operators

JavaScript
JavaScript Arrays
الدروس

JavaScript Arrays

Print array in JavaScript

Java Script Arrays Elements

Java Script Array Methods

JavaScript Multidimensional Array

JavaScript
JavaScript Objects
الدروس

JavaScript Objects

Java Script Print Object

Java Script Object Methods

Java Script Object vs Array

JavaScript
JavaScript Control Flow
الدروس

JavaScript if else and else if Conditions

JavaScript Conditional Ternary Operator

JavaScript Switch

JavaScript
JavaScript Loops
الدروس

JavaScript For Loop

JavaScript While Loop

JavaScript forEach Loop

JS for OF

Js Break and Continue

JavaScript
JavaScript Functions
الدروس

JavaScript Functions

JavaScript Function Definitions

JavaScript Function Parameters

JavaScript Function Call

JavaScript Function Invocation

JavaScript Function Apply method

JavaScript Block statement

JavaScript Function Closures

JavaScript Scope

JS Events

JavaScript
JS HTML DOM Basics
الدروس

JavaScript Document Object Model

JavaScript DOM Get Elements

JavaScript DOM Set Elements

JavaScript DOM Attributes

JavaScript DOM Create Element

JavaScript DOM Remove Methods

JavaScript DOM CSS

JavaScript DOM ClassList

HTML DOM Collections

JavaScript
JavaScript Events
الدروس

JavaScript DOM Events

JavaScript DOM EventListener

JavaScript Click Event

JavaScript UI Events

JavaScript Mouse Events

JavaScript Form Events

JavaScript
JavaScript Navigation
الدروس

JavaScript DOM Navigation

JavaScript parentNode Method

JavaScript childNodes Method

JavaScript firstChild Method

JavaScript lastChild Method

JavaScript nextSibling Method

JavaScript previousSibling Method

JavaScript parentElement Method

JavaScript nextElementSibling Method

JavaScript previousElementSibling Method

JavaScript
JavaScript Browser BOM
الدروس

JavaScript Browser Object Model Introduction - BOM

JavaScript Window

JavaScript window open Function

JavaScript window close Function

JavaScript Window Screen Object

JavaScript Window Location Object

JavaScript Window History Object

JavaScript Window History State

JavaScript History pushState Method

JavaScript SPA Single page application

JavaScript Window Navigator

JavaScript Timing Events

JavaScript
JavaScript ES6
الدروس

Arrow Function

JavaScript Cookies

JavaScript Classes

Math Methods

Number functions

String Functions

JavaScript Sets

Maps

JavaScript
OBJECTS Advanced
الدروس

Object Definition

Object Properties

Object Methods

Display Objects

Object Accessors

Object Constructors

Object Prototypes

Object Iterables

Object Sets

Object Maps

JavaScript
JavaScript Classes
الدروس

Class Intro

Class Inheritance

Static Methods

JavaScript
JavaScript Async
الدروس

JS Callbacks

JS Asynchronous

JS Promises

JS Async/Await

JavaScript
JavaScript Web APIs
الدروس

Web API Intro

Web Forms API

Web Storage API

Web History API

Web Workers API

Web Fetch API

Web Geolocation API

JavaScript
JavaScript AJAX
الدروس

AJAX Introduction

AJAX XMLHttp

AJAX Request

AJAX Response

AJAX XML File

AJAX PHP

JavaScript
JS JSON
الدروس

JSON Intro

JSON Syntax

JSON vs XML

JSON Data Types

JSON Parse

JSON Stringify

JSON Object

JSON Array

JSON Server

JSON PHP

JSON HTML

3
JavaScript
Others
الدروس

Java Script Array Advanced Methods

JS DOM Nodes

JS DOM Nodes

JavaScript
JS HTML DOM Advanced
الدروس

Creation Methods

JS DOM Animation

DOM Document

Add elements

Child Elements

Class Elements

Client Properties

has properties

insert Properties

Scroll Properties

IS Methods x

Offset Prosperities

4
BootStrap

BootStrap

تركز مادة BootStrap على تعلم كيفية إنشاء تجربة واجهة مستخدم سلسة ومرنة لمواقع الويب، وذلك من خلال المكونات والأدوات المساعدة في بناء صفحات الويب، كما يمكن استخدامها لتنظيم وتنسيق المحتوى والهيكل العام لصفحة الويب بشكل فعال؛ مما يؤدي إلى تصميم متجاوب وجذاب يعمل على مختلف أحجام الشاشات.
BootStrap
BootStrap Basics
الدروس

BootStrap Introduction

BootStrap
BootStrap Division
الدروس

Bootstrap Containers

Bootstrap Grids

BootStrap
BootStrap Typography
الدروس

BootStrap Typography

BootStrap
BS Base CSS
الدروس

Bootstrap Colors

Bootstrap Buttons

Bootstrap Button Groups

Bootstrap Tables

Bootstrap Images

Bootstrap Alerts

Bootstrap Progress Bars

Bootstrap Spinners

Bootstrap 4 Jumbotron

Bootstrap Badges

Bootstrap Pagination

Bootstrap List Groups

Bootstrap Cards

Bootstrap Forms

Bootstrap Inputs

Bootstrap Utilities

Bootstrap Flex

BootStrap
BS JavaScript
الدروس

Bootstrap 4 Dropdowns

Bootstrap 4 Collapse

Bootstrap 4 Navs

Bootstrap 4 Tabs

Bootstrap 4 Navigation Bar

Bootstrap 4 Carousel

Bootstrap 4 Modal

Bootstrap 4 Tooltip

Bootstrap 4 Popover

Bootstrap 4 Toast

Bootstrap 4 Scrollspy

Bootstrap 4 Icons

Bootstrap Media Objects

5
ReactJS

ReactJS

تركز مادة ReactJS على فهم كيفية بناء واجهات المستخدم الديناميكية والتفاعلية على الويب بواسطة إطار العمل ReactJS، والذي يهدف إلى تسهيل إنشاء وإدارة واجهة المستخدم UI، حيث يمكن تقسيم التطبيق إلى مكونات صغيرة وقابلة لإعادة الاستخدام، وبفضل هذا التقسيم يصبح بناء تطبيقات الويب أكثر تنظيمًا وسهولة.

6
Git

Git

تركز مادة Git على معرفة كيفية استخدام Git لإدارة إصدارات المشروعات في بيئة عمل متكونة من أشخاص مختلفين يعملون معًا على نفس المشروع، وذلك من خلال تتبع التغييرات وبعد الانتهاء منها يتم دمج تلك التعديلات؛ مما يسهل التعاون على المشاريع البرمجية المشتركة.

دعنا ننير لك الطريق!

  • هل أنهيت معسكر أساسيات علوم الحاسب وقررت البدء في مجال تصميم وبرمجة الواجهة الأمامية لمواقع وتطبيقات الويب؟
  • هل أنت حديث التخرج وترغب بالعمل في مجال تصميم وبرمجة الواجهة الأمامية لمواقع وتطبيقات الويب؟
  • أم لديك عمل حالي ولكن ترغب في تغيير مجالك الوظيفي إلى مجال تصميم وبرمجة الواجهة الأمامية لمواقع وتطبيقات الويب؟
  • وهل ترغب في معرفة ما الذي يتطلبه الأمر حتى تصبح محترف في مجال تصميم وبرمجة الواجهة الأمامية لمواقع وتطبيقات الويب؟
  • هل تريد تجربة الدراسة أولًا قبل دفع آلاف الجنيهات وإضاعة وقتك في دورات تدريبية متخصصة لا تجدها مجدية فيما بعد؟
  • هل تريد التعرف على سوق العمل عن قرب ومعرفة كيف تسير الأمور داخل الشركات كأنك أحد المبرمجين؟
  • ماذا عن العمل بالدول العربية؟ أو حتى العمل بشكل حر من المنزل والوصول لعملائك من أي مكان؟

احصل على إجابات كل تلك الأسئلة وأكثر من خلال هذا المعسكر التدريبي الذي يقدم لك كل ما تحتاج
لمعرفته عن مجال الويب بسوق العمل المصري والعربي
ماذا ستتعلم

ستتعلم كيفية بناء هيكل صفحة الويب باستخدام عناصر HTML المختلفة.

ستتعلم كيفية استخدام أنماط وتنسيقات CSS المختلفة لتنسيق وتصميم العناصر على صفحات الويب.

ستتعرف على مفاهيم الـResponsive Web Design لتجعل الصفحات تستجيب لأحجام الشاشة المختلفة.

ستتعلم كيفية استخدام JavaScript لإضافة وظائف تفاعلية إلى صفحات الويب.

ستتعلم كيفية بناء وتطوير واجهات المستخدم الديناميكية باستخدام ReactJS.

ستتعلم كيفية استخدام Bootstrap لتسريع عملية تصميم وتنسيق صفحات الويب.

ستتعلم كيفية استخدام Git لتتبع التغييرات في الكود، والتعاون مع الآخرين، وإدارة الإصدارات.

المتطلبات

الرغبة في التعلم.

جهاز computer شخصي.

نظام تشغيل، مثل: Macintosh, Linux, Windows.

الاتصال بشبكة انترنت قبل الدخول في هذه الدورة.

إنهاء معسكر أساسيات علوم الحاسب أو اجتياز اختباراته.

المسمى الوظيفي

مطور مواقع الويب

مصمم مواقع الويب

مطور تطبيقات الويب

مصمم تطبيقات الويب

مطور مواقع الويب باستخدام React JS

مطور الواجهة الأمامية لمواقع وتطبيقات الويب

تعرف على المدربين بهذا المعسكر

Mostafa Hefny

مؤسس المنصة, ومطور تطبيقات الويب

بدأ مصطفي حياته المهنية منذ خمسه عشر عام بالعمل في مجالات تصميم وبرمجة مواقع الإنترنت باستخدام لغات برمجيه مثل HTML, CSS, PHP, لينتقل بعد ذلك إلى مجال التدريب, وقد فضل أن يحقق طموحاته في هذا المجال بشكل مستقل, فأسس اكاديمية سفن داش التدريبيه وذلك في مطلع عام 2010. وقد عمل منذ ذلك الوقت وحتى الآن مدرباً للغات برمجة مواقع الإنترنت بداخل سفن داش, وفي وقت لاحق اسس شركة اخرى متخصصه في مجالات تصميم وتطوير مواقع الإنترنت اسماها "تركسيز", ليجمع بذلك بين الخبرة في سوق العمل ومهارات التدريب.

معلومات تهمك
  • لا تنسى تقييم الدروس لكي نُحدّث المُحتوى باستمرار حتى ينال إعجابك.
  • لا تنسى مشاركة الموقع مع أصدقاءك حتى تعمّ الفائدة وتكون سبب في نفعهم.
مشاركة
0
0
0
0
عدد المشاركات
هل هذه المعلومات نالت إعجابك ؟
0
0
عدد التقييمات