#内容
Vue.Jsを使ってフロントを書いています。
HTMLテーブルの中身をサーバーから渡す際に、現在はpythonを使ってJINJAのテンプレートで渡しています。
しかしながら、さらにWEB-APPの知識を得たいために、
PYTHONを止めて、別の言語でバックエンドを書きたくなりました。
html
1<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> 2 3<div id="content"> 4 <div class="container-fluid"> 5 <h1>公報データ</h1> 6 <p> 7<div id="app"> 8 <mycomp /> 9</div> 10 11<!-- mycomp7s temlpate --> 12{% raw %} 13<script type="text/x-template" id="template"> 14 <table border="1"> 15 <tr v-for="(raw,rawi) in item_list" v-bind:key = "rawi"> 16 <td v-for="(cell,celli) in raw" v-bind:key = "rawi * 10 + celli" >{{cell}}</td> 17 </tr> 18 </table> 19</script> 20{% endraw %} 21 22<!-- vue script --> 23<script> 24Vue.config.devtools = true; 25d = {{ items|tojson }}; 26ind = {{ ind |tojson }}; 27 28Vue.component('mycomp', { 29 template: '#template', 30 data:function(){ return {item_list: d }; } 31}); 32 33new Vue({ 34 el: '#app', 35}); 36 37</script>
python
1@app.route('/home') 2def home(): 3 question_id = "aaa" 4 mapios = get_mapios_data(question_id ) 5 result = get_mapios_data("test") 6 7 items = [mapios[0].values(),result[0].values()] 8 items = [list(x) for x in zip(*items)] 9 ind = [key for key in mapios[0].keys()] 10 11 return render_template( 12 'index.html', 13 ind = ind, 14 items = items, 15 patent_number = question_id 16 )
#質問事項
いまのところは、PYTHON側のTEMPLATEに依存していますが
ステップとしては
1. python側を単純にAPI化する。
→ その前には、VUE.JSのコンポートの使い方や、AJAXを勉強する。
2. Python側をNODE.JSに置き換える。
→ NODE.JSを勉強する。
などを考えています。
API化できれば、バックエンドは如何様にも簡略できるし、
他言語に移植することも、かなり容易になる。
他えば、JAVA, ASP.NET(C++,C#), RUBY, PHP, GO, RUST など
少し悩んでいるのは、このままVUE.JSをベースに続けるべきなのか
それともREACT,ANGULARなども勉強した方が良いのか? です。
これからエンジニアとして、WEBアプリを開発していくうえで
身に着けていくべきスキルについて、良い道しるべがありましたら
教えてください。
また現状のコードを見て、まだ足りないスキルなどありましたら、
ご指摘いただければと思います。
回答2件
あなたの回答
tips
プレビュー