TORICOインターン生のブログです。会社で起きたことについて情報発信していきます。

インターン41日目!# いい運動しました

本日はいらなくなった資材の移動のヘルプをしていました。

結構重くて大きいものを階段を上下して運んだのですが、夏なだけあって汗だくだくになりました。

普段は運動不足気味なので、いい機会になりました。

さて、プログラミングの方ですが、サーバーサイドは覚えることがとても多いですね笑

本日はテキストの操作して、それをdatetimeを使って文字列をdatetime型に直して営業日計算をすることをしていました。

あとは、自動テストをやったりと、一気に新しいことがどーんと来て混乱することもありますが、やっぱりただ教材で文法を写しているだけと比べると、

無理矢理でも慣れていっている感覚がします。

もう少ししたらまた結構Djangoが書けるようになっていることを祈ります。

インターン39/40日目!# python

Djangoのためにpythonの基礎からやり直している保坂です。

Python 簡単ってよく聞きますが、個人的にハマりどころが多いなと思います。

例えばfor-else文は laravelpythonでは挙動が違うらしいですし、

辞書型はjsでいうオブジェクトに似ているので、同じかと思いましたら違いますし、type()で型判定したら

Class ——って出てくるのでpythonでは型はclassなの?とか思ったり

トリプルクオートで複数行のコメントアウトかと思ったらdocstringとかいうものでした

あとは

__init__.py , __name__, __main__ここら辺は暗号にしか最初見えなかったです笑

ということで新しいことを始めると、一気に新しい知識が増えるので、頑張っていきたいです。

インターン38日目!# Django難しすぎ

本日からDjangoをやり始めました。

久々に触ったのですが、python自体をよく知らないままDjango入ると結構難易度高いです。

しかし1日中見ていたら、だんだん今までやっていたjsの共通部分が見えてきまして、ましになってきた。

Djangoをやって一番難しいなと思ったのはプロジェクトのディレクトリ構造ですね。

今までvue cli, laravelあたりはディレクトリがなんとなく、どういう規則で配置されているかとか、ファイルの中身とか推測しやすいですが、

Djangoは個人的に複雑に感じます。

例えば__init__.pyというファイルはいたるところに見かけますが、そんなに初期化する必要があるファイルばかりなのかとか思いますし、肝心の中身は空っぽですし、よくわかりません。

あとはpycharmを使っているのですが、このIDEの設定が難しいですね。。。

インターンの入りたてに戻った感じです笑

こういう時にはタスクを通じてひとつずつ覚えて慣れていくのがいいですね。あとは普通にpythonの概要をもう一度おさえようと思います。

インターン36・37日目!#そろそろpythonをまたやり直します

最近は社内タスク管理ツールの方の改修も、社内の方達ともコミュニケーションが取れるようになってきたので、

仕様の方の把握もスムーズに済むようになったり、改修も自力でやれるようになってきました。

残っているタスクを確認しましたら、残りはサーバーサイドを扱う必要が出てきましたので、今までvuetypescriptに絞ってきましたが、ついにサーバーサイドの方も

手をつけ始める時期が来ました。

( フロントはvue+typescript、サーバーサイドはDjango です)

今までwebアプリケーションを一人で構築する力があまりなかったので、これを機に作れるようなれると思うとかなりこれからが楽しみですね。。

ただこれで晴れてサーバーサイドに移れるかと思いきや、今日は日付を扱う場所でどハマりしまして、

日付の計算に苦労しました。ただ解決してみると数学的に難しいというよりは、そういう処理の考え方、発想がなかったのでこれも結局慣れの問題だと思います。

今後も頑張っていきます(出勤数が増える予定です)

インターン35日目!#メールテンプレート 画面で編集できるようにしました。

長らくこのタスクをやっているイメージですが、最近は大体の機能は実装できていて、実際にデプロイされたものを

使ってもらって、抜けていたところを改修、もしくはbuildできるようにしたりlintをかけたり、気に入らなかったデザインをscssで調整していたりしていました。

今日はtypescriptnom install したモジュールがtypescriptに対応していないと

Importでかけません。

対処法としていくつか方法があるのですが、

まず nom install @types/…で入れるタイプはまずそんなものは存在していないよ。とはじかれ

コメントアウトで触れておけばエラーが出なくなる、requireで書くものは今回コンポーネントを取り出す上で、書き方がよくわからず

最終的にはsrcの下に@typesを作ってそこにdeclare  moduleで宣言して、それだけだとこの場所がわかってもらえないのでtsconfigを修正してimportで書けるようになりました。

あとはscssで調整しているときに、 componentに書いたscssはブラウザの検証ツールで見るとタグがかなり変わっていますので、検証ツールから読み取ったタグをscssで書いていくのですが、vuetifypropによってタグが変わったり、そもそも長すぎてよくわからなかったり、ひどいコードになってしまったので大元のタグにclass名を振ってまとめました。

時間がかかってしまいましたが、手が止まってしまう時間は短くなってきた気がします。

インターン34日目!# 試験期間終わったらリフレッシュとプログラミングの勉強しようと思いました

今日も社内タスク管理ツールの開発をしていました。

前回問題だったメールテンプレート の確認画面を出すところですが、自作のコンポーネントを作るのもいけそうでしたが、最終的にネットから拾ってきたものをnpm installしてそれで作りました。

メールテンプレートを表示するだけではなく、編集するタスクに関しては、前回v-for文で表示されたものはtextarea内では読み込めないという問題があったのですが

そこは新しくからの変数を作っておいて、そこにslotの内容を入れてから、その変数をvtextareaで表示することにしました。

vmodelで情報を連動させればテキスト画面で編集してもそれがそのままメール内容として送れるのですごい便利です。

一箇所度ハマりしたところがあってv-model= this.変数って書いていたのですが、ずっとそれでは読み込めずこれに気づくのにかなり時間がかかってしまいました。

ただググるだけではなくて挙動も詳しくならないとダメですね。

夏休みに入るのでリフレッシュしながら勉強しようと思います。

インターン33日目!# できそうでできない

相変わらず、社内でのタスク管理ツールを開発している保坂です。

最近はできそうでできないものに苦戦させられています。。。

本日は

1:発注メールを送信するときに文に訂正があったら、そのメールテンプレートを編集できるようにするというものです。

メールのテンプレートはvueslotで作って、その中で配列とかに格納した情報を自動表示するなどしているのですが、それを編集そのままできるように、

textareaで囲みました。

Slotの中にtextareaを使ってもpreタグを使っても読み込みますが、その中にv-forで回しているtemplateタグがあると急に動かなくなりますね・・・

まずはそこを解決しなければなりません

2:次に発注メールを送るときに確認画面が出ないので、モーダルを出したいのですが、既にモーダルで出しているのでまたモーダルで出すとくどくなりますね。

Vuetifyでそれらしきものは確認できず・・・新しくコンポーネントを作ったのですがimportexportも問題なしなのに表示されないので、

そこらへんを次回考えていきます

インターン32日目!# やるべきことが尽きません。

エンジニアという仕事について、ある疑問を思ったことがあります。

作り終わったあと、エンジニアいらなくなるのではないか。という素朴な疑問です。

改修するところが出てくるとはいえ、そんな常にエンジニアって常にいなければならないのかと思っていました。

特に会社など1つの場所で働く形態の場合。。。

昨日、タスクツール管理を完成させて、使ってもらうと次々に直すところが出てきます。

直すところがなくなってもより良いものにするためにやることは出てきます。

新しい技術が出てくれば、それに対応させる必要も出てきます。

つまり、常に何かやることがあるのが、この仕事です。

結構エンジニアって性格とか気分で向いているかどうかあるのではないかと思いました。

気分が乗っていたり、楽観的でしたら新しい技術について学ぶのも、何か創作しているのも捗ります。

一方、逆の場合は時にはこれが負担になる時もあるでしょう。

つまり、エンジニアにとってただ技術だけではなくメンタル管理も大事な要素ということをふと思った1日でした。

インターン31日目!# メールテンプレートがついに完成しました!

発注メールのテンプレート自動作成の実装に取り掛かり始めてからだいぶ時間が掛かってしまいましたがついに今日完成しました!

今思うと、これまでやってきたタスクは何か1つできるようになれば実装できましたが、今回は今までやってきたテクニックを総合的に使うことが必要でした。

扱っているのはVue + TypeScript ですが

コンポーネント間のデータの受け渡し方

(お恥ずかしいですが) filterpushなど基本的なメソッドの使い方

Dateオブジェクトを操作

営業日などを入れての日程計算

Vuex

正規表現

クラスや関数を自作

Slotの使い方

Vuetifyの使い方

Gmail API

といったものを使えるようになりました。

といってもサポートもたくさんして頂いたので、もっと自力でできるようにならねばと思った1日でした。

ですが、今日はずっと苦戦してたタスクがひと段落してよかったです。

続く。

インターン30日目!# gmailに苦戦(4)

今日も相変わらず社内タスク管理ツールの開発をしていました。

前回の続きなのですが、gmailの署名をそのツールに持ってくるというものなのですが、

人によって書き方が違うのでただエンコードしただけでは、署名のスタイルに差が出てしまいますね。

そこで正規表現を使います。

あとはPromiseを何となくコピペで済ましていたのですが、限界が来たと感じましたので黙々勉強していました。

非同期処理は今いろんなやり方があって、どれも一長一短ですね。。。とりあえず全部使えるようになります。

続く。

インターン29日目!# gmailに苦戦(3)

相変わらずタスク管理ツールから自動的に発注メールを送る機能の実装と戦っています。

流石にそろそろ終わらせたいですね・・・。

gmailの方で、宛先、件名、本文をタスク管理ツールから送ることはついにできました!!

前回は贈りたい文章がslotに入っていたので、それをいかに変数に入れるか考えていたのですが、よくよく見たらお隣さんの.tsdocument.getBy—系をいい感じに書いた関数があったのでそれを利用して解決しました。

Slotでできるかは不明のままですが、とりあえずまずは動けば良しと・・・特に時間がかかってしまっているとそう思います。

あと残っているのは署名をメール本文下部に貼り付けることです。

署名機能自体はgmailにありますが、直接gmailにアクセスはしないのでこれを使うのは難しそうです。

本文とかはapiで送れたので署名もapiで送れないかと考えた結果、それっぽい機能がありましたがなぜかapiからそれをコールできなくてなぜか困っています。

gapi.client.gmail.users.settings.sendAs.list({})

これで署名を入った配列が返ってくるはずなんですが・・・

戦いは続く。

インターン27・28日目!# gmailに苦戦(2)

昨日に引き続きまして、gmailapiに苦戦しています。

苦戦している理由としては、参考になる情報は検索したら出てくるのですが、

当然ですが、素のjsで記述されています。

ところが今の管理タスクツールはtypescriptで開発していますので、そのままコピペというわけにはいきません。

Import のやり方で悩み、とりあえず、これで取り込めているだろうと仮定して、コードを書いてみてエディターに怒られるという繰り返しの1日でした。

最終的に読み込むのを手伝っていただき。。。index.htmlwindowからapiを作ることで不要なモジュールもいらなくなりましたし、importを書く必要も無くなりました。

今度は出力したい内容をjs内でslotを変数に入れたいのですが、ここで今度は苦戦しているので、slotの勉強をしようと思います。

わからないところが毎回見つかるので、勉強のいい方針ができるのでインターンはありがたいです。

続く。

インターン26日目!# gmailに苦戦

いつも通り、社内タスク管理ツールの開発を行なっていました。

今手こずっている改修タスクがありまして、

こちらが注文したいものの詳細をまとめたものを管理ツールの方で自動で作成するようにして、それをgmailで相手に送るというものです。

メールの文面を自動で作るところまではできました!

しかし、それをgmailの方にうまく移すことができません。

原因はget送信なので送れる文字数に制限があるせいだと思います。

改修に入る前はメールで1つのみの発注ができる仕様であったので、文字数に問題はなかったのですが、

チェックボックスをつけた数の発注ができるようになったので、文字数がオーバーしてしまうこともでてきました。

ということで方法を根本的に変える必要がありますので、今はgmailAPIに挑戦してみることにしました。

明日に続く!

インターン25日目!# ついに自分で実装できました!

本日もタスク管理ツールの改修をやっていました。

今日のタスクはデータテーブル上のチェックをつけたキャンペーン情報の情報をメールテンプレートに自動表示するというものでしたが、

件名に作品の名前を書く部分があります。

もちろんチェックボックスにチェックをつけた数だけ、条件を分岐する必要があり。。。

ここら辺の仕様は第3者はわかりませんので割愛しますが、初めてほぼ自分の力で機能を実装できたと思います!

これからもっと自力でできる範囲を広げていきますー!

インターン24日目!# データの受け渡しに苦労しました。

本日もタスク管理ツールの改修をやっていました。

今日のタスクはデータテーブル上のチェックをつけたキャンペーン情報の情報をメールテンプレートに自動表示するというものでし

たが、チェックをつけた行だけ新たな配列に格納することはできたのですが、それをメールテンプレート側に渡す方法がわかりませ

ん。

Vueのコンポーネントから直接渡すのはあまり良くないらしく、

最終的には新たにtypescriptのファイルを作りそこに処理をかくやり方でやるのですが、一度情報をvuexを使ってstoreから取ってきた

り、新しく作ったtypescriptのファイルから新しいクラスを生成して新たな型を作ったりなど、新しいやるべきことが盛りだくさんの

一日でした。

あとはエラーが起きた原因を調べる方法で,エディターが怒っているところをみる(webstorm使用)やchromeの検証のconsoleをみ

る、console.logをみるなどの方法を取っていたのですが、

今日は新しくdebuggerを使ってエラーを確かめられるようになりました。便利すぎたので今後がっつり使っていきます

インターン23日目!# 日付処理

こんにちは、今日も社内タスク管理ツールの改修です。

本日はバナーの発注するときに呼び出されるメールテンプレートの改修をしていました。

締切日を自動的に表示させるところで、当初は普通に締切日をそのまま表示させていたのですが、二日前かつ営業日に表示を変えて欲しいとの声をいただいたので、それについて考えていました。

二日前だけなら簡単なのですが、そこに休日ではないという条件が必要です。

そこでプラグインを探すわけですが、koyomi.jsという営業日を色々といい感じにしてくれるものがあったらので、それで実装することができました。

途中でつまずいたところでは,

このプラグインはjsで今はtypescriptで書いているので、importでの読み込み方がよく分からなかったことです。

最終的にrequireで読み込んでくれたので良かったですが、importを使った方法はないのでしょうか・・・笑

次の改修ではついにVuexと戦うことになりそうです。

続く。

インターン22日目!# バグ修正

本日もまたタスク管理の改修作業です。

ついにデプロイされたので、ユーザーのフィードバックが返ってきます。

やはり人に使ってもらえると自分では気付けなかった不具合などが見つかりますね。

自分で作っているときは結構自分好みで作れるところがありますが、フィードバックから生まれるタスクは相手の要望をより汲み取る必要があるので、

少し自分が逃げていたような開発に向き合わなければなりません。

本日は検索した言葉が含まれるタスクを編集しているとランダムでその編集画面が消えてしまうというものでした。

最初はそのエラーがいつ起きているかも分からなかったですが、実際にエラーが起きているところをヒアリングした結果、

編集している間に検索したワードに一致している部分を消してしまうと検索条件から外れてしまい、検索結果から消えてしまうというものでした。

解決自体はシンプルなコードでしたが、そもそも今回はどのようなエラーが起きているか自体が分からなかったので、最近はvueがちょっとできるようになって画面にのめり込みがちですが、コミュニケーションを忘れてはいけないと思った日でした。

続く。

インターン21日目!# 出来るようになってきた感じがします。

ついにインターンも21日目になりました。

最初は環境構築から始まって、初めて使うフレームワークも言語も意味がわかりませんでしたが、最近は少し慣れてきたようで、ただネットの記事を丸コピレベルから

自分で少しオリジナルのコードが書けるようになってきました。

こうなると自分好みの機能とかが作れるようになってくるのでプログラミングが楽しくなってきます。

最近はある条件の時、セレクトボックスとかを出すといった処理をよく書くのですが、

変数作って

真偽判定するコード書いて

その時にif文でその部分を出す。

みたいな自分の中で定番処理が出てきました。

持ちネタが増えることで迷う時間も減りました。そしてまた新しいことを覚えようとする余力も出てきますね。

今日はVue.jsでリアクティブなプロパティを動的に追加するとこでつまずきましたので$setとかそこらへんを調べていこうと思います。

次回に続きます!

インターン20日目!# 実装

本日は前回の続きをやっていました。

ある情報をまとめたデータリストがあってチェックボックスにチェックをつけると、それらのプロジェクトの進行状況を一括で変更できるというものなのですが、

<v-checkbox>でチェックボックスを作り,v-modelでチェックした複数のリストを取得し、

進行状況の初期値を変数に入れておいて、取得したリストがidと合致する時が、ループさせて状態を変化させているうちにあったら、v-selectitemsに対応する値で進行状況を書き換えるということをやりました。

今までで一番書けたのですが,プロミス処理が分からなかったのでそこを補強しようと思います。

インターン19日目!# 分かってきましたけど、動かない

インターンも19日目となりました。最初はまだ来て数回かとか思っていましたが、時間が過ぎるのは本当に早いですね!

それから先日、社内全体の飲み会に参加させて頂きました。

会場は池袋虜だったのですが、室内、出される飲み物、料理とも全部おしゃれで感動しました。

ゲームも楽しかったですし、幹事さんたちに感謝です。

業務の方ですが、最初は何がわからないかわからないぐらいのvueでしたが、最近少し慣れてきまして、関数も自分で組み立てられるようになってきましたし、コンポーネント間の情報の受け渡しもできるようになってきました。

しかし、それでも作るべき機能の実装は難しいです。

今までは言語自体に苦しまされてましが、最近はロジックで悩まされています。

あと、最近タイピング効率化を推奨されており、私はプラインドタッチは日本語打つところは問題なくできるのですが、記号とかはブラインドタッチができません。

今度は完全なブラインドタッチをしようと、今は手が拙い感じになっています笑

色々やるべきことが見えてきて、楽しいですね。

それではまた次回に続きます。