Single Page App: מערכת ניתוב

אהרן

@רחמים
זה לא מנושא האשכול אבל כאן כותב דברים מפחידים על אנגולר [3 חודשי לימוד בקורס מסודר! לא פחות]

גם פה הודעה 6 והלאה, יש מחסרונות האנגולר.
גם פה ועוד אחד

עזוב אותך משטויות.

רק אנגולר גירסה אחת. תשאל את מי שמכיר את זה. נכון שלכל דבר יש חסרונות. אבל לאנגולר יש את הכי פחות חסרונות.

למה גירסה 1 שהוא בדרך להיות לא רלוונטי?

פורסם במקור בפורום CODE613 ב27/02/2016 20:23 (+02:00)

avr416

אכן, אני בשאיפה ללמוד אנגולר (התחלתי קצת..),
(רחמים - עם כל החסרונות שציינת, אך למערכת שעניינה ניהול תרומות ולקוחות וכדו' אנגולר מאד מתאים).
אולם מדובר באתר שכבר רוב התצוגות שלו קיימות (בrazor), כך שלבנות את הכל מחדש באנגולר - זה לא שייך כרגע.
השאלה האם אפשר שרק המסגרת החיצונית תהיה אנגולרית (כלומר העמוד הראשי), אך את כל התצוגה הוא יקבל מהשרת?
בעצם הקונטרולר של כל קישור יקבל בסה"כ את הכתובת לשרת, ויציג את התוכן בדף? כי נראה לי שאנגולר הוא "סגור" ואני לא יכול להריץ פונקציות של js שלא דרכו, כך שאע"פ שהוא יציג את התוכן, אך אח"כ כל הפעולות שנעשות בצד הלקוח - לא יעבדו...

תודה.

פורסם במקור בפורום CODE613 ב27/02/2016 21:09 (+02:00)

magicode

@אהרן

@mat
@רחמים
זה לא מנושא האשכול אבל כאן כותב דברים מפחידים על אנגולר [3 חודשי לימוד בקורס מסודר! לא פחות]

גם פה הודעה 6 והלאה, יש מחסרונות האנגולר.
גם פה ועוד אחד

עזוב אותך משטויות.

רק אנגולר גירסה אחת. תשאל את מי שמכיר את זה. נכון שלכל דבר יש חסרונות. אבל לאנגולר יש את הכי פחות חסרונות.

למה גירסה 1 שהוא בדרך להיות לא רלוונטי?

לדעתי גירסה אחד תמשיך להיות והיא תתפצל מגירסה 2 כלומר יהיו הרבה שלא ירצו לעבור לגירסה 2. וזה ישאר כפרוייקט נפרד.

פורסם במקור בפורום CODE613 ב27/02/2016 22:48 (+02:00)

אהרן

ולמה גרסה 1 עדיפה?

פורסם במקור בפורום CODE613 ב27/02/2016 22:49 (+02:00)

magicode

@אהרן

ולמה גרסה 1 עדיפה?

כי עכשיו גירסה 2 לא פעילה. אז זה לא קיים מבחינתי.

כי עכשיו אני צריך לתכנת. לא מחר.

בכל מקרה ברגע שמשנים יותר מידי. זה כבר לא אנגולר. זה כבר נהיה משהו אחר.
וזה יהיה הדעה של הרבה אנשים. לכן אני חושב שזה מה שיהיה.

פורסם במקור בפורום CODE613 ב27/02/2016 23:05 (+02:00)

אהרן

@mat

@אהרן
ולמה גרסה 1 עדיפה?

כי עכשיו גירסה 2 לא פעילה. אז זה לא קיים מבחינתי.

כי עכשיו אני צריך לתכנת. לא מחר.

בכל מקרה ברגע שמשנים יותר מידי. זה כבר לא אנגולר. זה כבר נהיה משהו אחר.
וזה יהיה הדעה של הרבה אנשים. לכן אני חושב שזה מה שיהיה.

אם אין עדיפות בשפה עצמה
אז זו לא בהכרח המלצה נכונה בשביל מי שלומד עכשיו
אני טועה?

פורסם במקור בפורום CODE613 ב27/02/2016 23:09 (+02:00)

ארכיטקט

avr העצה שלי מאז ומעולם בנושא הזה, החזק את הלוגיקה חזק בצד השרת!!! וכתוב בצד הלקוח איך שאתה רוצה. תוכל תמיד להחליף, כי צד הלקוח זה בבחינת "מלבוש", צד השרת זה בבחינת "גוף" והדטה בייס בבחינת "נפש" את הבגדים תמיד אפשר להחליף, הגוף מתחלף לאיטו במהלך החיים, ואילו הנפש זה הדטה והזיכרון תמיד נשאר לכן צריך אדם להקפיד מאוד על הדטה בייס שזהו קודש הקודשים. עד כאן בפילוסופיה.

לגופו של עניין.
כפי שזה נראה היום אנגולר כאן כדי להישאר, עדיין לא נמצא תחליף לפתרונות שלה שהם מקיר לקיר, וה"חסרונות" שמציינים בכל הקישורים שהביא רחמים, הם כקליפת השום לעומת היתרונות שהיא הביאה לעולם, שזה אבסטרקציה, אבסטקרציה, ועוד פעם אבסטרקציה ואבסטרקציה. אסור להתעלם מזה!!! זהו כל עולמו של המתכנת האנושי (כן אני יודע שיש מתכנתים שכותבים אלף פעם "אסור לדבר באמצע השיעור" שלזה אנחנו קוראים משפט הקוף המקליד אחר כך לקוחות אומרים "מה אתה רוצה הוא כתב תוכנה שעובדת" אוי לאותה בושה...)

אז ברור שזה קשה ללמידה, וכי ראית דבר טוב שהוא קל ללמידה??? אבל יש קשה ללמידה, ויש רע ללמידה, שזה 2 דברים נפרדים, ואסור לערבב ביניהם. אנגולר היא לא "רעה" ללמידה במובן זה שאין לה שיטתיות וסדר (הדוגמאות של ToCode מביישות מאוד ואין לייחס להן חשיבות) זאת שיטה עמוקה וחזקה מאוד, ולכן היא קשה ללמידה.

אני חוקר את הנושא כבר חצי שנה. וזה מזכיר קצת את אלו שטוענים ל"חסרונות" מנוע הבנזין, כאשר האלטרנטיבה היא לחזור לסוסים ועגלות. החלום של כולם זה פרפטום מובילה סוג של פריימוורק שרק מתחשק לך משהו והוא מציג לך את זה בלי שום מאמץ, זה לא יקרה נקודה, גם לא בעולם התוכנה.

אז חזק ואמץ, אל תערוץ ואל תחת כי עמך ה' אלוקיך בכל אשר תלך.

פורסם במקור בפורום CODE613 ב28/02/2016 23:34 (+02:00)

רחמים

תכל'ס,
מה יש באנגולר שאין באחרים למשל ב asp mvc?
למה את WPF אפשר ללמוד בשבועיים ואת אנגולר 3 חודשים לפחות ?
אם מתכנת כבר יודע CSS HTML JS וכבר בנה אתרים ב webForms וגם ב asp mvc למה צריך שאנגולר ילמד אותו משהו כל כך שונה שיקח לו ג' חודשים לקלוט את זה?

אם אנגולר כל כך טוב למה זרקו את גירסה 1 ועברו ל 2?
ולמה זרקו את אנגולר ועברו לריאקט?
פרימוורק לא אמור לכבול אותך מכל צד אלא לתת לך כלי עזר לבצע דברים, אבל אתה לא אמור להיות חייב לבנות את כל האתר שלך רק על פי דרכו של הפרימוורק.

ואל תשכח מה שבעצמך כתבת בחסרונו של האנגולר.

מי שנעול על קוד פתוח אז מאוד יכול להיות שאנגולר זה מה שיש ואין מה לעשות, אבל מי לא, יש לו עוד כמה ברירות.

שלא תבין לא נכון אין לי שום דבר נגד או בעד שום טכנולוגיה אני פשוט רוצה לברר ולשקול מעלות מול חסרונות.

פורסם במקור בפורום CODE613 ב29/02/2016 08:38 (+02:00)

ארכיטקט

השאלות שלך בדיוק מסבירות את התשובה, עצם הדבר שאין אפשרות להגיד לך על קצה המזלג, כי זה עולם חדש, עולם בפני עצמו, זה לא עוד פונקציה של משהו. ריאקט אגב מכסה בערך עשירית ממה שאנגולר בא לכסות, ולכן גם מאוד קל לשווק אותו, כי הוא מאוד ממוקד במטרה מסויימת, זאת לא תפיסה חדשה.

תחשוב על אחד שלא למד תיכנות מעולם, הוא ישאל אותך מה אפשר לעושת ב C# שאין ב Java. העולם של אנגולר קצת רחוק מלהיות פריימוורק לג'אווה סקריפט, הרעיון שלהם יותר מזכיר מחולל יישומים, כמו אקסס וכדומה.

בגדול הרעיון הוא כזה, שפת הקליינט מאז ומעולם היתה פונקציונלית, ולא אובייקטלית, ומטבע הדברים לא כל שכן שלא היתה דקלרטיבית. הם הפכו אותה לאובייקטלית וגם דקלרטיבית, מה שמקל מאוד על המתכנת בפרוייקטים גדולים, מבחינת ניהול הקוד, ההיגיון שלו, קוד לא הולך לאיבוד. יישום עקרונות תיכנות כגון Single responsibility principle, Don't repeat yourself ועוד הרבה.

כל מי שהתנסה באנגולר מודה ומתוודה, אין כמו הארכיטקטורה שלהם, עצם הדבר שקוד לא הולך לאיבוד בשום צורה, זה כבר יתרון שלא יסולא בפז. השאלה הגדולה היא מה יותר חשוב לך בתיכנות, הצד העקרוני או הפונקציונלי.

פורסם במקור בפורום CODE613 ב29/02/2016 09:51 (+02:00)

אהרן

ואיך מהירות התגובה שלו בעבודה מאוד אינטנסיווית על הDOM?

פורסם במקור בפורום CODE613 ב29/02/2016 15:03 (+02:00)

אהרן

ואת זה ממולץ לקרוא.
http://www.softwarearchiblog.com/2016/0 ... ogies.html

הוא זרק את node.js ועבר ל-go של גוגל...

פורסם במקור בפורום CODE613 ב29/02/2016 15:24 (+02:00)

ארכיטקט

@אהרן

ואיך מהירות התגובה שלו בעבודה מאוד אינטנסיווית על הDOM?

זה לא פרפטום מובילה :lol: :lol: :lol: הוא דורש משאבי מערכת ויש למטב את הביצועים... כמו בכל דבר בעולם.
עקרונית יש נטייה לקלל את הפרימוורק הזה מבחינת רינדורים אבל הסיבה היא בגלל שכל כך הרבה דברים אפשריים בו אז אנשים משתוללים כאילו אין לזה מחיר, ושמים מאות ולפעמים אלפי פקדים שמחוברים בבינדיג כפול, כמו"כ לא צריך לטעון את כל הפקדים מיידית עם עליית הדף וכן הלאה. בקיצור, צריך לעשות אופטימיזציה כמו בכל תוכנה, ובשביל זה יש מתכנתים טובים ומתכנתים רעים, אחרת כל חמור היה מתכנת ולא היה לבני האדם מקום בעולם הזה כלל...

פורסם במקור בפורום CODE613 ב29/02/2016 15:10 (+02:00)

magicode

@רחמים

תכל'ס,
מה יש באנגולר שאין באחרים למשל ב asp mvc?
למה את WPF אפשר ללמוד בשבועיים ואת אנגולר 3 חודשים לפחות ?
אם מתכנת כבר יודע CSS HTML JS וכבר בנה אתרים ב webForms וגם ב asp mvc למה צריך שאנגולר ילמד אותו משהו כל כך שונה שיקח לו ג' חודשים לקלוט את זה?

אם אנגולר כל כך טוב למה זרקו את גירסה 1 ועברו ל 2?
ולמה זרקו את אנגולר ועברו לריאקט?
פרימוורק לא אמור לכבול אותך מכל צד אלא לתת לך כלי עזר לבצע דברים, אבל אתה לא אמור להיות חייב לבנות את כל האתר שלך רק על פי דרכו של הפרימוורק.

ואל תשכח מה שבעצמך כתבת בחסרונו של האנגולר.

מי שנעול על קוד פתוח אז מאוד יכול להיות שאנגולר זה מה שיש ואין מה לעשות, אבל מי לא, יש לו עוד כמה ברירות.

שלא תבין לא נכון אין לי שום דבר נגד או בעד שום טכנולוגיה אני פשוט רוצה לברר ולשקול מעלות מול חסרונות.

asp mvc. בכלל לא קשור לאנגולר. ולא דומה לו. ולא יכול להחליף אותו.

וגם אף אחד לא זרק שום דבר. רק מציגים עוד רעינות

ואם דיברת על הקוד פתוח אז דווקא יש יותר מידי אפשרויות שממש מקשות על ההחלטה.
ולכן אמרתי שלא יבדוק כלום. שילך על אנגולר וזהו.

מקור.
http://todomvc.com/

ואת זה ממולץ לקרוא.
http://www.softwarearchiblog.com/2016/02/choosing-technologies.html

פורסם במקור בפורום CODE613 ב29/02/2016 15:09 (+02:00)

dovid

@avr416

למה אתה לא מחבב את הספר?

האופי שלו מבולבל, כל נושא מקבל נגיעה ונעזב לטובת האחר. הפרקים התקועים של הtesting הם לדעתי תוצאה קלאסית של "ספר לאליטות" ששם אוי ואבוי ללמוד משהו שאי אפשר לבחון אותו בtdd. אין שום סיבה למה לא לשמור את כל הקטע של הטסטינג לאחרי שתכיר את אנגולר, ואפשר לכתוב במהלך הפרקים שאפשר לעיין שם כדי לבדוק את האמור פה.
אבל הכי עצבן אותי זה הדוגמה בעמוד 70 שמייצגת מאוד. למה צריך סרויס? כי... בא תלמד מאה מושגים חדשים (swithc, sub-controller). ותשתמש איתם בדיוק כמו שאנו רוצים (את הבעיה ניתן לפתור בשתי שניות עם קונטרולר, אבל בדרך שיש בדוגמה יש בעיה ולכן..) ואז תבין (?) למה צריך, וברגע שתבין נעבור לפרק הבא במקום להסביר בדיוק מה זה סרויס או להרחיב על הסרויסים הקיימים באנגולר.

פורסם במקור בפורום CODE613 ב08/03/2016 12:51 (+02:00)

avr416

@דוד ל.ט.

ב. הדפדפן אמור שלא להריץ סקריפט שהוכנס בhtml מסיבות אבטחה, כך אני קורא פה: https://developer.mozilla.org/en-US/doc ... /innerHTML שונה ממה שנראה פה http://stackoverflow.com/questions/6109 ... 96#3603496
ג. זה כנראה לא הגיוני להביא תצוגה עם סקריפט. זה תוצאה מהארכיטקטורה הקודמת?.

ראיתי פה בתשובה הראשונה הוא אומר שאם אתה מגדיר בdataType HTML זה אמור לעבוד.. אבל זה עדיין לא עבד לי.
אמנם בתשובה השניה שם (באותו קישור) הוא כותב שאם משתמשים ב innerHTML זה אכן לא עובד, אז שיניתי והשתמשתי בפונקציה של JQuery - append וזה אכן עובד מצויין!
הנה הקוד המעודכן:

self.before_show = function (_url) {       
        $.ajax({
            url: _url,
            dataType:'html',
            success: function (data) {                
                $(container).append(data);
                self.after_show();
            },
            error: function (data) {              
                $(container).append(data);               
            }
        });
    };

אכן, זה תוצאה של הארכיטקטורה הקודמת, שכל התצוגות כבר ממומשות בrazor ואני רק צריך להוסיף את מערכת הניתוב..
במקביל אני מנסה לכתוב את כל הפרוייקט מחדש באנגולר, ומנגד שהשרת יחזיר רק JSON אבל עוד ארוכה הדרך לפנינו :lol:

למה אתה לא מחבב את הספר?

פורסם במקור בפורום CODE613 ב08/03/2016 12:39 (+02:00)

dovid

אגב אני ממש לא מחבב את הספר, אבל עוד לא מצאתי משהו אחר (שמעודכן).

פורסם במקור בפורום CODE613 ב08/03/2016 12:19 (+02:00)

dovid

כמה הערות:
א. אנגולר טוען את הדף רק פעם אחת, אח"כ זה בקאש.
ב. הדפדפן אמור שלא להריץ סקריפט שהוכנס בhtml מסיבות אבטחה, כך אני קורא פה: https://developer.mozilla.org/en-US/docs/Web/API/Element/innerHTML שונה ממה שנראה פה http://stackoverflow.com/questions/610995/cant-append-script-element/3603496#3603496
ג. זה כנראה לא הגיוני להביא תצוגה עם סקריפט. זה תוצאה מהארכיטקטורה הקודמת?.

פורסם במקור בפורום CODE613 ב08/03/2016 12:17 (+02:00)

avr416

כמה עדכונים:
א. התחלתי ללמוד אנגולר קצת יותר רציני ואני בעמוד 55 :lol: !! (דילגתי על הפרק של הUnit test כמו שmat המליץ).
ב. ניסיתי להוסיף לפרוייקט רק את הניתוב של אנגולר, וזה עובד מעולה בטעינה הראשונית של הדף. העניין הוא שהוא טוען רק את הHTML ולא את כל הסקריפטים שמאחוריו, כך שזה לא בדיוק עוזר לי.
ג. ניסיתי לממש מערכת ניתוב בעצמי, הנה הקוד:

window.app = {
    Pages: {},
    pages: {}
};
//בנאי של עמוד
window.app.Pages.Page = function (container, url) {
    
    var self = this;   
    self.el = document.createElement('div');   
    self.url = 'https://localhost:44300'  +url; //כמובן שזהו שרת מקומי וצריך לשנותו כל חד לפום דרגא דיליה..

    self.before_show = function (_url) {
        var result;
        $.ajax({
            url:_url,
            success: function (data) {
                result = data;
                self.el.innerHTML = result;
                container.appendChild(self.el);
                self.after_show();
            },
            error: function (data) {
                result = data;
                self.el.innerHTML = result;
                container.appendChild(self.el);
            }
        });
    };
//אופציה להוסיף קוד שיפעל לאחר טעינת העמוד
    self.after_show = function () { };

    self.show = function () {
        container.innerHTML = '';
        self.before_show(url);       
              
    };
};

//קריאה לעמוד הנכון ע"פ שינוי הHash (#)
function hash_changed() {
    var new_hash = window.location.hash;    
    var page_name = new_hash.substr(1);
    var pages = window.app.pages;

    if (pages[page_name]) {
        pages[page_name].show();
    } else {
        console.log('Page not found: ' + page_name);
    }
}

window.addEventListener('hashchange', hash_changed);

וזה המימוש:

var container = document.querySelector('#pageBody');
var Pages = window.app.Pages;
var pages = window.app.pages;

pages.page1 = new Pages.Page(container, '/DonorsVM/_Index');
pages.page2 = new Pages.Page(container, '/Donation/DonationManagment');
pages.page3 = new Pages.Page(container,'/ManageOrganization/Index');

הבסיס של הקוד בנוי על קוד של ינון פרק ממדריך שלו באתר - ToCode, ואני שיניתי אותו שהוא לא יטען תבנית של HTML אלא יטען קוד מהשרת ע"י AJAX ויציג אותו למשתמש.

הבעיה שלי היא שגם כאן אני חוזר לאותה בעיה שהייתה לי בשימוש עם UI-Router של אנגולר, שזה לא טוען לי את הסקריפטים. כלומר, התשובה שמתקבלת מהשרת אכן מכילה את תגיות הscript אולם משום מה הדפדפן לא טוען אותם..
כשהשתמשתי באנגולר חשבתי שזה בגלל שצריך להגדיר לו בקונטרולר בדיוק מה לעשות - אחרת הוא לא מתייחס לזה.
אולם, זה קורה לי גם כשאני מממש בעצמי, ואין לי מושג למה זה קורה? הרי כשאני טוען את אותו דף עם אותם תגיות ע"י בקשת AJAX פשוטה, הוא כן טוען את הסקריפטים - אז מה השתנה?
תודה רבה לעוזרים..

פורסם במקור בפורום CODE613 ב08/03/2016 11:25 (+02:00)

dovid

<script type="text/javascript">
    angular.module('files', [])
        .controller('MainCtrl', [function() {
              this.collection = @Json.Encode(YourCollection);
         }]);
</script>

פורסם במקור בפורום CODE613 ב03/03/2016 18:51 (+02:00)

avr416

תודה רבה mat ודוד ל.ט.!

@דוד ל.ט.

(אתה יכול להכניס את הJSON ישר בתוך מנוע הView של הRazor).

לא הבנתי מה הכוונה??
@דוד ל.ט.

אני חושב שאכן אתה יכול להמשיך הכל כרגיל ולהתמש רק בניווט של אנגולר וכן ראיתי פה: http://stackoverflow.com/a/27182836/1271037
אבל אני רק בעמוד 70 אז אני לא מתערב.

מעולה!! זה בדיוק מה שאני מחפש, נראה איך זה ילך.
וכמובן, ברור שזה רק פתרון זמני, כי עקרונית הכי טוב שהכל יהיה ע"י JSON..

פורסם במקור בפורום CODE613 ב03/03/2016 18:20 (+02:00)

תחומים - פורום חרדי מקצועי

Single Page App: מערכת ניתוב