آموزش فرانت با انگولار - قسمت اول

[@ehsandigitaly8645]

دمت گرم رفیق گل خیلی اقایی

[@GeekMeek]

♥♥♥ عزیز دلی احسان جان

[@zahraghorbani3562]

خیلی اموزش قابل فهم و جامعی بود . واقعا به دادم رسید این ویدیو

[@ArashTaravati-t5x]

واقعا آموزشتون عالی بود و ساده و واضح توضیح میدید❤❤

[@mansourbagheri4308]

عالی بود مرسی و منتظر ویدیوهای بیشتر از شما دوست عزیز

[@alialaei9395]

سلام ممنون از آموزش کاربردی و قشتنگت

[@GeekMeek]

🙏🌺 سلام علی جان ممنون از محببت

[@farazbadpeyma1742]

haji awali bood mamnoon💙

[@GeekMeek]

خواهش میکنم فراز جان
نظر لطفته 😍🌻🙏

[@AmirhoseinAkhlaghi-h3i]

عالی،ممنون از ویدیوی خوبت

[@GeekMeek]

درود بر شما ممنون از محبتتون

[@samanehdelbari3351]

خیلی خوب بود، ممنونم بابت ضبط این ویدئو😊👏🌹

[@GeekMeek]

خواهش میکنم خوشحالم که ازویدیو ها راضی هستید 🙏👌

[@farnazmoghadam9598]

سلام خیلی ممنونم خیلی لطف کردید موفق باشین

[@GeekMeek]

سلام خواهش میکنم, ممنون از شما 🌺🙏🏻

[@alialaei9395]

سلام مجدد و ممنون از اینکه پاسخگو بودین

[@GeekMeek]

سلام علی جان, خواهش میکنم وظیفه هست

[@iamhamed7847]

عالی و کاربردی مثل همیشه💎👌

[@m.asifsafari828]

عالیه ..شاد باشید.

[@GeekMeek]

🙏

[@walidrasouli7995]

Thanks ❤❤❤

[@GeekMeek]

😍

[@firesoul63]

مرسی از ویدیوی مفید و خوبتون. فقط به نظرم برای دیزاین صفحه وقت زیادی توی این ویدیو گذاشتین. معمولا کسی که میاد این ویدیو رو ببینه برای یادگیری انگولار میاد، نه وب دیزاین یا بوت استرپ. بازم ممنون.

[@GeekMeek]

سلام ممنون بابت دیدگاه خوبتون کاملا موافقم, در ویدیو آینده سعی میکنم این موضوع رعایت بشه

[@ehsandigitaly8645]

ایوالله داری رفیق

[@GeekMeek]

عزیزمی احسان جان , همیشه لطف داری به من 🙏🏻🌹

[@ehsandigitaly8645]

@@GeekMeek فدایی داری

[@hosseinhosseini30]

سلام خدمت شما
امیدوارم حالتون خوب باشه
و ممنون از ویدئو های خوبتون
میخواستم ببینم که میشه در مورد reactjs و redux هم آموزش بذارید
تشکر میکنم ازتون

[@GeekMeek]

سلام حسین جان, ممنونم من هم امدیوارم شما هم خوب و خوش و سلامت باشید. ممنون از اینکه از ویدیو های کانال من استفاده میکنی و باعث رضایتمندی شما شدم. حتما در مورد reactjs و redux ویدیو مفصل و قوی میسازم براتون, ممنون بابت پیشنهاد خوبت دوست من.

[@hosseinhosseini30]

@@GeekMeek خیلی عالیه انشاالله که پُر قدرت ادامه بدید و همیشه رشد کنید و موفق باشید.

[@GeekMeek]

@@hosseinhosseini30 ممنون از شما که به من انرژی دادین, محبت دارید و شما هم موفق باشید دوست عزیز

[@apexcenter-f9y]

خدا قوت ممنون بابت ویدیوهایی که مذارید
الان من یک سوال داشتم خدمت شما که بهترین لایبرری برای کار با دیتابیس و حجم دیتای بالا چیه ؟

[@GeekMeek]

ممنون دوست عزیز سلامت باشی
بستگی به نوع پروژه و ساختار دیتابیس لازم پروژه هم mongoDB خوبه هم postgress
این دو دیتابیس ساختار متفاوتی دارند و در شرایط متفاوتی استفاده میشند
اگر نیاز دارید فیلتر پیچیده ای روی دیتا داشته باشید خب postgress خوه
اگر نیاز دارید دیتای زیادی رو لود کنید ولی query پیچیده ای ندارید mongoDB گزینه بهتریه

[@m.asifsafari828]

خواهیش میکنم یی دوره آموزشی ازJs Next هم بزارید.

[@GeekMeek]

🙏 حتما به روی چشم

[@animroozrooz]

سلام استاد یه سوال خیلی مهم دارم تیم ما با انگولار و فلاتر کار میکنه روی یک ماژول الان آیا میشه فلاتر را با انگولار سینک کرد مثلا از فلاتر وب خروجی گرفت و در انگولار تحت یک روت داد طوری که روت خود انوگلار حساب بشه . در واقع هر خروجی فلاتر وب یک ماموپوننت در انگولار حساب بشه . ممنون میشم راهنمایی کنید .

[@GeekMeek]

سلام دوست خوبم
راستش تا حالا چنین کاری انجام ندادم
فکر کنم از نظر تکنیکالی بشه انجامش داد ولی خیلی چالش داره
یکیش اینه که فلاتر وب خروجیش روی canvas اجرا میشه و کلا رندرش با انگولار متفاوته
یک مورد دیگه هم اینه که فلاتر وب فقط یک فایل نیست حاوی کلی کتابخانه جدا برای رندر هست که بردنشون توی انگولار کار دشواری هست

[@AmirMohamadi-e7e]

همین دقیقه دو سطح علمی دوره ت رو مشخص کزدی.... ری اکت فریم ورک نیست یک کتابخونه ست ، تفاوت این دوتا رو بعنوان تمرین سرچ گن ❤❤❤

[@GeekMeek]

مرسی که گفتی 😘

[@sara_353]

سلام خسته نباشید، این آموزش انگولار چند هست؟ با آخرین نسخه خیلی تفاوت داره؟

[@GeekMeek]

سلام متشکرم
Angular CLI: 14.2.7
Node: 18.16.0 (Unsupported)
Package Manager: npm 9.5.1

[@sourena_pa]

سلام،
خیلی عالی، روان و شفاف و مفید. ضمنا از راحت بودن و کد زدن راحت و بی استرس شما هم لذت بردم!
آیا سورس کد این درس رو در جایی قرار دادید که بشه دریافت کرد؟ در گیت هابتون نبود! ممنون

[@GeekMeek]

سلام دوست من , سپاس از محبتتون و انرژی مثبت خوبی که دادین. متاسفانه سورس کدش رو ندارم ولی از آموزش های بعدی پروژه محور ها رو حتما در github آپلود خواهم کرد.

[@sourena_pa]

@@GeekMeek
باز هم ممنون از شما مهندس،
حیف شد. سعی میکنم از اول ببینم ویدیو رو و از روش بنویسم. اگر احیاناً پیدا کردید لابلای فایل هاتون ممنون میشم اطلاع بدید! 🙏🏼🙏🏼 پایدار باشید💐💐

[@GeekMeek]

خواهش میکنم دوست من , حتما 🙏🌺

[@alialaei9395]

بازم شرمنده از اینکه اذییتتون میکنم🙁

[@GeekMeek]

دشمنت شرمنده علی جان, من اذیت نمیشم لذت میبرم از اینکه با شما در تعامل باشم. 🙃

[@alialaei9395]

سلام چرا لینک رو کامنت میزارم بارگزاری نمیشه؟

[@GeekMeek]

سلام علی عزیز بله لینک ها بلاک میشند توی کامنت و در نتیجه کامنت شما اسپم میشه و من نمیتونم ببینم سریع

[@alialaei9395]

url گیت هاب رو از اولش برداشتم که بارگزاری بشه

[@GeekMeek]

اره اومد علی جان چکش میکنم

[@alialaei9395]

@@GeekMeek سلام خسته نباشید

[@alialaei9395]

@@GeekMeek به قول شاعر: دست از تو برندارم تا کام دل برآید....-عذر خواهی از این همه مزاحمت، فرصت کردین فایلی که تو گیت آپلود کردم رو ببینین، من هنوز دنبال حل مشکل هستما یادم نرفته!!!

[@sara_353]

سلام. من از قسمت مرورگر میتونم بین صفحات برم. اما وقتی روی تگ aکلیک میکنم هیج اتفاقی نمی افته. تگ لینگ برام فعال نیست. همه چی رو درست نوشتم و هیچ اروری ندارم. شما میدونید مشکل از چی میتونه باشه؟

[@GeekMeek]

درود بر شما تگ a رو با چه اتریبوتی لینک کردید
باید حتما به این شکل باشه
مثلا این شکلی
و /home در فایل route شما موجود باشه

[@alialaei9395]

استاد می تونید کمک کنید؟ من این کد رو طبق اموزش زدم ولی روی subscribe خط کشیده و میگه از نسخه 8 به بعد منقضی شده!!! چجوری باید کد رو بزنم که ارورش برطرف بشه؟ اینم کدی که نوشتم طبق آموزش:

[@GeekMeek]

سلام علی جان, شما با تغییر ورودی subscribe مشکلتون باید حل بشه لینک زیر رو مشاهده کنید مشکلتون برطرف خواهد شد. اگر نشد دوباره کامنت بزارید همین جا برام و کدتون رو باهام share کنید.
stackoverflow.com/questions/55472124/subscribe-is-deprecated-use-an-observer-instead-of-an-error-callback

[@miladmashayekhi6235]

awlie

[@alialaei9395]

کد که گفتین رو زدم اما در قسمت
if(output.status)
ارور داره: ارورش اینو میگه:
any
Cannot find name 'output'.ts(2304)

[@GeekMeek]

علی جان کل کدت رو یکبار برام بفرست اینجا بی زحمت

[@tahefmirbaluch9974]

سلام
این آنگولار است

[@GeekMeek]

سلام بله

[@alirezazaer474]

عالی فلاتر رو چرا ادامه نمیدی😢

[@GeekMeek]

سلام دوست من ممنون, فلاتر ۱۰۰ درصد ویدیو بعدی خواهد بود , منتظر باشید لطفا

[@alirezazaer474]

@@GeekMeek ممنونم❤️

[@GeekMeek]

@@alirezazaer474 خواهش میکنم

[@mahdikh276]

@@GeekMeek دمتون گرم❤❤❤

[@fatemehgorji2729]

react کتابخانه است فریم ورک نیست

[@GeekMeek]

درود بر شما
مرسی
این همه مطلب مهم گفته شد فقط همین رو متوجه شدید!
ضمنا بنظر شما react با مثلا کتابخانه ای مثل bcrypt یکی هست؟؟؟؟
هر دو بله کتابخانه هستند اما ریکت یا انگولار مجموعه ای از کتابخانه ها هستند که در نهایت بهش میگن فریمورک

[@fatemehgorji2729]

حرص خوردن نداره ، فریم ورک با کتابخانه فرق داره که بازم الان حرفتون رو تغییر دادید دارید میگید هر دو فریم ورکن . کتابخانه یعنی به شما پیچ و مهره و چکش بدن دستتون بگن خودتون یک محصول رو درست کن با توجه به سلیقه خودتون ولی فریم ورک عین یک کارخونه است که یک سری دستگاه های پیشرفته است و هر دستگاه کاری رو انجام میده مثل دستگاه تراش چوب که برای درست کردن محصول شما میاین ی سری تغییرات توی دستگاه ایجاد میکنید که مطابق میل شما عمل کند و ان محصول را دربیاوردید . در react بر اساس سلیقه خودش معماری رو تغییر میده ولی انگولار ساختار یکپارچه داره و فولدر بندیش مشخصه.@@GeekMeek

[@alialaei9395]

کد اینترفیس
export interface ContactInterface {
name: string;
email: string;
desc: string;
}
export interface ContactFeedbackInterface {
status: boolean;
message?: string;
data?: any;
}

[@alialaei9395]

سلام مجدد و خسته نباشید
import { Component, ElementRef, OnInit, ViewChild, } from '@angular/core';
import { ContactService } from '../services/contact.service';
@Component({
selector: 'app-contact',
templateUrl: './contact.component.html',
styleUrls: ['./contact.component.scss']
})
export class ContactComponent implements OnInit {
isCallingAPI: boolean = false;
isSubmitted: boolean = false;
name: string = '';
email: string = '';
desc: string = '';
@ViewChild('txtName') txtName?: ElementRef;
@ViewChild('txtEmail') txtEmail?: ElementRef;
@ViewChild('txtDesc') txtDesc?: ElementRef;
constructor(private service: ContactService) { }
ngOnInit(): void {
}
sendForm() {
this.isCallingAPI = true;
this.service.sendContactForm({
name : this.txtName!.nativeElement.value,
email : this.txtEmail!.nativeElement.value,
desc : this.txtDesc!.nativeElement.value
}).subscribe({
next:(output)=>{
this.isCallingAPI = false;
if(output.status){
this.name = this.txtName!.nativeElement.value;
this.email = this.txtEmail!.nativeElement.value;
this.desc = this.txtDesc!.nativeElement.value;
this.isSubmitted = true;
}
},
error:()=>{
console.log('server output', Error);
this.isCallingAPI = false;
}
});
}
}

[@GeekMeek]

سلام عزیزم ممنون شما هم خسته نباشی, باید توی پرانتز جایی که بعد از next خروجی رو گزاشتی بهش تایپ بدی
next:(output:ContactFeedbackInterface)
این شکلی
یعنی به عبارتی باید output که داخل پرانتز گزاشتی حتما type ContactFeedbackInterface رو داشته باشه تا کار کنه کدت

[@alialaei9395]

@@GeekMeek سلام اینکار رو کردم و مقادیر رو که از طریق فرم ارسال می کنم تو کنسول مرورگر این رو بر می گردونه!!!:
Empty string passed to getElementById().
server output
function Error()
​
length: 1
​
name: "Error"
​
prototype: Error.prototype { stack: "", … }
​
: function ()

[@GeekMeek]

@@alialaei9395حالا داخل html کامپونتت یه مشکلی هست
کدای html رو هم بفرست ببینم

[@GeekMeek]

@@alialaei9395 کل پروژت رو پوش کن تو گیت لینک گیت بفرست ببینیم چی شده

[@alialaei9395]

alaeiali67/geekproject