Hi Jody, Well, I started completely from scratch (regarding frontend development) about 6 months ago. I'd been avoiding it and finally had a situation where it was needed. I don't know if this is the best route, but it's the one I took.
Javascript: I choose scrimba.com for learning HTML, CSS, and Javascript. It's a remarkable platform for learning. The lessons are short and you can pause the lesson and insert your cursor into the code they are demoing, try stuff, then hit play and the code reverts. They have a frontend developer's path - I did the first 15-20% and got what I needed to get my project going. As I started to learn javascript I thought "This looks a lot like the direction 4D is headed" Framework: What I learned about frameworks, is that you need to pick one that is going to be supported. In scrimba, they picked REACT because they say it is maintained by Facebook. I did not take the time to learn REACT because my project was for mobile devices and I got some starter code from a developer that used jQuery Mobile. Of course, jQuery Mobile stopped development and maintenance back in Oct, but it's good enough to get me going. (Hence, pay attention to the framework you learn!) jQuery itself may have more longevity - I don't know. Software: Web Browers have AMAZING developer tools right in the browser. I chose Chrome. Just hit F12 (mac) and BAM, you have a full debugger. You can trace your Javascript, set break points, force the cache to always load from the server (key to testing), see all your variables. Pretty cool! Visual Studio Code (mac) Pretty powerful editor. It has features I wish 4D had like: - option-shift-down arrow: will instantly duplicate your line to the line below - option-click: you can put multiple cursors on the same document. You can put 6 cursors in six places and when you type you type (or delete) in all six places at the same time. - support for Emmet. As best I can tell it's a standard set of macros for development. Remarkably powerful. https://emmet.io/ Communicating with 4D: I chose JSON. It seems like a format both Javascript and 4D like. They literally have the same commands for converting objects to JSON and back. On the web page I create an object in Javascript with all the data I am sending to 4D (including signon info, tokens, anything). You stringify it and send it to 4D with a Post command. I send it via 4DAction. The Object shows up directly in the 4D method and you parse it to a 4D Object. I rolled my own token system so I can know if the "user" is authorized for the method. I essentially created an API for my app. The nice thing is that it completely separates 4D from the HTML. The advantage is I don't have to rebuild my 4D application to update the interface - since the interface is just HTML and Javascript files. If our web guy needs info, I just create a method for him that returns what he needs. The biggest leap for me in making calls from Javascript is that the calls should be asynchronous (synchronous calls have been deprecated in general because they mess with the web users experience). This means that before you make a call to 4D from a web page, you tell Javascript which function will (if it ever gets a response) run when the browser gets a reply. You make the call and then the webpage continues as if nothing happened. Good luck! I'll be curious which way you decide to go! dave -- David Nasralla Clean Air Engineering On Wed, Oct 20, 2021 at 11:17 AM Jody Bevan via 4D_Tech <4d_tech@lists.4d.com> wrote: > > I have asked a similar question over on the FORUM, and got two responses. I > know more people than two have developed web pages and 4D applications > working together. > > I really need to get into designing both. > > - The advantage I have is that I am starting from scratch with web > development and 4D and the web. The 4D database linked over the web that I > personally developed with HTML back in the early 90s are way out of date. I > want to learn the new way of working, because that will future proof my > skills, and the sites/Applications I develop. > > - The disadvantage I have is that I am starting from scratch. > > OK, having said that what tools do you recommend (and why)? There are so many > web development tools, and so many web developers that want to gobble up the > Database application behind it all (thus my work) as they ‘can do it all’. > > - I have seen talk about Angular, AngularJS, React ( Frameworks - correct). > - There are new tools in 4D since back in the early 90s obviously. > - Yes, REST is important, but what does that mean. > > A white paper from 4D on 4D v19 and the web and working together would be > very nice to have. > > The web sites I developed way back then, everything was in 4D. I wrote all > the static HTML and stored, and sent it out from 4D. That was then, but from > what I understand now things can work better as the WebServer itself can > interpret the JavaScript to execute code there - thus being faster. Of course > scalability is important to. No use using a tool that cannot scale. I > remember the first time I installed at a site with 150 concurrent users, and > a 20 x 300 foot chart room that would be put into our system along with all > new data. That scared me, but 4D 2004 did it. > > Any comments, thoughts, warnings, or drop by and say hello are all > appreciated. > > Thanks > > Jody Bevan > ********************************************************************** > 4D Internet Users Group (4D iNUG) > New Forum: https://discuss.4D.com > Archive: http://lists.4d.com/archives.html > Options: https://lists.4d.com/mailman/options/4d_tech > Unsub: mailto:4d_tech-unsubscr...@lists.4d.com > ********************************************************************** ********************************************************************** 4D Internet Users Group (4D iNUG) New Forum: https://discuss.4D.com Archive: http://lists.4d.com/archives.html Options: https://lists.4d.com/mailman/options/4d_tech Unsub: mailto:4d_tech-unsubscr...@lists.4d.com **********************************************************************
