Yes, please ... Looking forward to this combination ..
On Mon, Nov 27, 2017 at 10:44 PM, JosΓ© Luis Redrejo <jredr...@gmail.com> wrote: > I have begun to work on an easy setup, integrated with the way web2py > works. I have little free time to work on it, so it's not finished yet, but > I hope to have it ready soon. > It's based on manual implementations I have done in production > applications, but done in a more general and easy to use way. > I will share with you the git repo as soon as I finish it, just in case > anybody wants to use or improve it. > Regards. > > 2017-11-28 1:06 GMT+01:00 Massimo Di Pierro <massimo.dipie...@gmail.com>: > >> I agree. I wish there was a way (and may be there is but I do not know) >> to to what webpack does from inside the browser of the developer so that >> the developer does not have to install node. If that were possible we could >> distribute vue components with web2py and not worry about users installing >> the node stack. >> >> Massimo >> >> >> On Monday, 27 November 2017 14:13:27 UTC-6, JosΓ© L. wrote: >>> >>> Massimo, I am sure most of the people in this group agree with you, >>> having the same preference. Coming from the python world we feel more >>> comfortable using that kind of js interaction. >>> I am one of them, and I chose web2py for my personal work some years >>> ago because of its simplicity against other frameworks complexity. >>> However, working as you mentioned force you to miss most of the rich >>> environment available using node modules. >>> >>> Unfortunately, nowadays to build a modern web site you need to be fluent >>> in 5 "languages" at least (python, JavaScript, html, css & sql) plus some >>> frameworks (web2py, bootstrap, vue/react, not to mention other things like >>> sqlalchemy in some cases). I agree it's not comfortable at all, but >>> currently I see only two solutions for it: >>> >>> 1. If you can work exclusively for chrome/firefox you will be able to >>> work with node-modules in the browser, without the cli , using an elegant >>> solution as https://medium.com/@oleg.agapov/basic-single-page-applicatio >>> n-using-vue-js-and-firebase-part-1-9e4c0c11a228 >>> >>> 2. In the medium term we might have webcomponents >>> >>> 3. Paid solutions like Anvil, https://anvil.works/, allowing you to do >>> everything in Python >>> >>> However, now, needing to support old versions of Firefox and Chrome, or >>> IE, Safari, Edge, etc. I don't see alternatives to the nightmare of webpack >>> and node cli if you want to do a modern application. >>> I think the approach you mention in your email would be similar to be >>> copying python files inside our application directories instead of using >>> pip install to install complete packages. So, my opinion is that we should >>> work on having a polished approach for future versions of web2py, similar >>> to what PHP Laravel community did with vue. >>> >>> >>> JosΓ© L. >>> >>> 2017-11-26 21:21 GMT+01:00 Massimo Di Pierro <massimo.dipie...@gmail.com >>> >: >>> >>>> It seems that using the cli is becoming standard these days but I still >>>> like the original simplicity of being able to write js without need for >>>> nodejs. >>>> >>>> I tend to program in this way: >>>> >>>> >>>> #... in index.html >>>> >>>> <div id="app"> >>>> <div v-if="page='mypage1"> >>>> <mypage></mypage> >>>> <button v-on:click="goto('mypage2')">next</button> >>>> </div> >>>> <div v-if="page='mypage2"> >>>> <mypage></mypage> >>>> <button v-on:click="goto('mypage3')">next</button> >>>> </div> >>>> <div v-if="page='mypage3"> >>>> <mypage></mypage> >>>> <button v-on:click="goto('mypage1')">start again</button> >>>> </div> >>>> </div> >>>> <script src="js/vue.min.js"></script> >>>> <script src="js/axios.min.js"></script> >>>> <script src="js/main.js"></script> >>>> >>>> # in js/main.js >>>> var app = {}; >>>> // make a component for each page or each reusable widget with a lazily >>>> loaded html >>>> Vue.component('mypage', function (resolve, reject) { >>>> axios.get('components/vue.mypage.html').then(function(res) { >>>> resolve(common_forms(res.data)); }); >>>> }); >>>> app.vue = new Vue({el:'#app data:{page:'mypage1'}, >>>> methods:{goto:function(page){app.vue.page=page;}}, filters:{}, >>>> components: {}}); >>>> >>>> >>>> # then I define the html for each component in its own lazily-loaded >>>> html file, for example >>>> # in components/vue.mypage.html >>>> <div> >>>> I am the template for the mypage component. >>>> </div> >>>> >>>> >>>> >>>> On Wednesday, 15 November 2017 09:33:28 UTC-6, Carlos A. Armenta Castro >>>> wrote: >>>> >>>>> Hi JosΓ©, >>>>> >>>>> I'm not in a hurry, but I will appreciate so much your help. >>>>> >>>>> Thank you! >>>>> >>>>> P.S. Your recipe with the Webpack proxyTable is working like a charm >>>>> in my dev server. π >>>>> >>>>>> lso, in webpack.config.babel.js configuration file , if you add >>>>>> >>>>>> >>>>>> devServer: { >>>>>> host: '127.0.0.1', >>>>>> port: 8001, >>>>>> historyApiFallback: false, >>>>>> noInfo: true, >>>>>> proxy: { >>>>>> '/yourapp/api/*': { >>>>>> target: 'http://127.0.0.1:8080', >>>>>> secure: false >>>>>> // changeOrigin: true, >>>>>> // pathRewrite: { '^/api': '' } >>>>>> } >>>>>> }, >>>>>> }, >>>>>> >>>>> >>>>> On Tue, Nov 14, 2017 at 12:58 PM, JosΓ© Luis Redrejo < >>>>> jredr...@gmail.com> wrote: >>>>> >>>>>> Carlos, by the way, if you are not in a hurry I can prepare a proof >>>>>> of concept this weekend. I just can tell it really works because I am >>>>>> using >>>>>> it in a system in production. >>>>>> >>>>>> Of course, that's the develop setup, once develop is done in >>>>>> production we use nginx-uwsgi only, but in that case there's no cors >>>>>> problem as everything runs in the same server. >>>>>> >>>>>> >>>>>> The only thing I miss in web2py (waving Massimo ;) ) is having >>>>>> something like http://pyramid-webpack.readthedocs.io/en/latest/ >>>>>> >>>>>> It would allow us to write in the view controller/function.html >>>>>> something like >>>>>> >>>>>> <link rel="stylesheet" href="{{=URL('static',webpack( >>>>>> 'controller/function.css'))}}"/> >>>>>> >>>>>> <script src="{{=URL('static',webpack('controller/function.js'))}}">< >>>>>> /script> >>>>>> >>>>>> >>>>>> It would fetch the built files using the dist/webpack-manifest.json >>>>>> automatically instead of having to write them manually. Now if I use js >>>>>> or >>>>>> css versioning I have to change the routes in the view whenever I execute >>>>>> webpack >>>>>> >>>>>> Regards >>>>>> JosΓ© L. >>>>>> >>>>>> 2017-11-14 20:37 GMT+01:00 JosΓ© Luis Redrejo >>>>>> >>>>>>> Hi Carlos >>>>>>> I would recommend you to use this webpack helper: >>>>>>> https://github.com/Plortinus/vue-multiple-pages >>>>>>> >>>>>>> Doing "vue init Plortinus/vue-multiple-pages new-project" you get >>>>>>> the structure to work, just add the div for app to the class and import >>>>>>> the >>>>>>> page js per each page. >>>>>>> >>>>>>> Also, in webpack.config.babel.js configuration file , if you add >>>>>>> >>>>>>> >>>>>>> devServer: { >>>>>>> host: '127.0.0.1', >>>>>>> port: 8001, >>>>>>> historyApiFallback: false, >>>>>>> noInfo: true, >>>>>>> proxy: { >>>>>>> '/yourapp/api/*': { >>>>>>> target: 'http://127.0.0.1:8080', >>>>>>> secure: false >>>>>>> // changeOrigin: true, >>>>>>> // pathRewrite: { '^/api': '' } >>>>>>> } >>>>>>> }, >>>>>>> }, >>>>>>> >>>>>>> >>>>>>> You can start web2py server, then webpack dev server and it will do >>>>>>> queries to web2py without any cors problem. >>>>>>> >>>>>>> i.e >>>>>>> http://localhost:8001/api/whatever will automatically be fetched >>>>>>> from >>>>>>> http://localhost:8080/yourapp/api/whatever >>>>>>> >>>>>>> That's how I set it up for web2py to be the backend, and webpack dev >>>>>>> server to run the frontend. >>>>>>> >>>>>>> >>>>>>> Hope it helps >>>>>>> JosΓ© L. >>>>>>> >>>>>>> 2017-11-14 17:48 GMT+01:00 Carlos A. Armenta Castro < >>>>>>> carlos.armen...@gmail.com>: >>>>>>> >>>>>>>> I have using Web2Py for too many years for commercial websites and >>>>>>>> for Intranets in MΓ©xico, I want to say that Web2Py is an AMAZING >>>>>>>> Framework!!! >>>>>>>> For my new project I need to use an SPA VueJs + Webpack for the >>>>>>>> FrontEnd ( http://quasar-framework.org/ ) and a Web2Py as my >>>>>>>> BackEnd API Server. >>>>>>>> I'm curious about to integrate his two web frameworks using web2py >>>>>>>> routes to serve this two apps in the same port but different URL. >>>>>>>> >>>>>>>> Example: >>>>>>>> http://127.0.1.1/welcome/api ---> My Web2py API Controller >>>>>>>> http://127.0.1.1/welcome ---> My VueJS APP with webpack ( >>>>>>>> http://quasar-framework.org/ ) <-- Pointing to index.html in >>>>>>>> *dist/ * and permit to use all the static files deposited in the >>>>>>>> same path *dist/** >>>>>>>> >>>>>>>> *VueJS + Webpack APP Structure* >>>>>>>> >>>>>>>> βββ *dist/ * *# Compiled APP (Serve this files as >>>>>>>> the static SPA)* >>>>>>>> β *βββ index.html >>>>>>>> β βββ fonts/ >>>>>>>> β β βββ ... >>>>>>>> β βββ static/ >>>>>>>> β β βββ ... >>>>>>>> β βββ js/ >>>>>>>> β β βββ ...* >>>>>>>> βββ config/ >>>>>>>> β βββ index.js # main project config >>>>>>>> β βββ ... >>>>>>>> βββ src/ >>>>>>>> β βββ main.js # app entry file >>>>>>>> β βββ App.vue # main app component >>>>>>>> β βββ components/ # ui components >>>>>>>> β β βββ ... >>>>>>>> β βββ assets/ # module assets (processed by webpack) >>>>>>>> β βββ ... >>>>>>>> βββ static/ # pure static assets (directly copied) >>>>>>>> βββ test/ >>>>>>>> ... >>>>>>>> >>>>>>>> Actually I am doing this work in my NginX Server but I Will be happy >>>>>>>> if I can do the same thing easily using pure web2py!!!! >>>>>>>> >>>>>>>> Why using the same port? Because the CORS issues, this is the best >>>>>>>> and easy way to deal with CORS. I know I can use sub-domains in the >>>>>>>> same port, I know I can use ALLOW ORIGIN headers in W2P side but that >>>>>>>> are not options for me in this case. >>>>>>>> >>>>>>>> NginX config working: >>>>>>>> >>>>>>>> location / { >>>>>>>> index index.html index.htm; >>>>>>>> root /home/www-data/vue/applications/simott; >>>>>>>> try_files $uri $uri/ /index.html; >>>>>>>> } >>>>>>>> >>>>>>>> location /api { >>>>>>>> uwsgi_pass unix:///tmp/web2py.socket; >>>>>>>> include uwsgi_params; >>>>>>>> uwsgi_param UWSGI_SCHEME $scheme; >>>>>>>> uwsgi_param SERVER_SOFTWARE nginx/$nginx_version; >>>>>>>> >>>>>>>> } >>>>>>>> >>>>>>>> Any recommendations? Thanks in advance! >>>>>>>> >>>>>>>> -- >>>>>>>> Resources: >>>>>>>> - http://web2py.com >>>>>>>> - http://web2py.com/book (Documentation) >>>>>>>> - http://github.com/web2py/web2py (Source code) >>>>>>>> - https://code.google.com/p/web2py/issues/list (Report Issues) >>>>>>>> --- >>>>>>>> You received this message because you are subscribed to the Google >>>>>>>> Groups "web2py-users" group. >>>>>>>> To unsubscribe from this group and stop receiving emails from it, >>>>>>>> send an email to web2py+unsubscr...@googlegroups.com. >>>>>>>> For more options, visit https://groups.google.com/d/optout. >>>>>>>> >>>>>>> >>>>>>> >>>>>> -- >>>>>> Resources: >>>>>> - http://web2py.com >>>>>> - http://web2py.com/book (Documentation) >>>>>> - http://github.com/web2py/web2py (Source code) >>>>>> - https://code.google.com/p/web2py/issues/list (Report Issues) >>>>>> --- >>>>>> You received this message because you are subscribed to a topic in >>>>>> the Google Groups "web2py-users" group. >>>>>> To unsubscribe from this topic, visit https://groups.google.com/d/to >>>>>> pic/web2py/pzyyNKajy0w/unsubscribe. >>>>>> To unsubscribe from this group and all its topics, send an email to >>>>>> web2py+unsubscr...@googlegroups.com. >>>>>> For more options, visit https://groups.google.com/d/optout. >>>>>> >>>>> >>>>> >>>>> >>>>> -- >>>>> Ing. Carlos Alberto Armenta Castro >>>>> Hermosillo, Sonora, MX. >>>>> >>>> -- >>>> Resources: >>>> - http://web2py.com >>>> - http://web2py.com/book (Documentation) >>>> - http://github.com/web2py/web2py (Source code) >>>> - https://code.google.com/p/web2py/issues/list (Report Issues) >>>> --- >>>> You received this message because you are subscribed to the Google >>>> Groups "web2py-users" group. >>>> To unsubscribe from this group and stop receiving emails from it, send >>>> an email to web2py+unsubscr...@googlegroups.com. >>>> For more options, visit https://groups.google.com/d/optout. >>>> >>> >>> -- >> Resources: >> - http://web2py.com >> - http://web2py.com/book (Documentation) >> - http://github.com/web2py/web2py (Source code) >> - https://code.google.com/p/web2py/issues/list (Report Issues) >> --- >> You received this message because you are subscribed to the Google Groups >> "web2py-users" group. >> To unsubscribe from this group and stop receiving emails from it, send an >> email to web2py+unsubscr...@googlegroups.com. >> For more options, visit https://groups.google.com/d/optout. >> > > -- > Resources: > - http://web2py.com > - http://web2py.com/book (Documentation) > - http://github.com/web2py/web2py (Source code) > - https://code.google.com/p/web2py/issues/list (Report Issues) > --- > You received this message because you are subscribed to the Google Groups > "web2py-users" group. > To unsubscribe from this group and stop receiving emails from it, send an > email to web2py+unsubscr...@googlegroups.com. > For more options, visit https://groups.google.com/d/optout. > -- Joe Simpson βReasonable people adapt themselves to the world. Unreasonable people attempt to adapt the world to themselves. All progress, therefore, depends on unreasonable people.β George Bernard Shaw -- Resources: - http://web2py.com - http://web2py.com/book (Documentation) - http://github.com/web2py/web2py (Source code) - https://code.google.com/p/web2py/issues/list (Report Issues) --- You received this message because you are subscribed to the Google Groups "web2py-users" group. To unsubscribe from this group and stop receiving emails from it, send an email to web2py+unsubscr...@googlegroups.com. For more options, visit https://groups.google.com/d/optout.
