かよ

未経験からエンジニアになり、サービスの運用保守、開発に携わりました。 Youtubeで…

かよ

未経験からエンジニアになり、サービスの運用保守、開発に携わりました。 Youtubeでもプログラミングや、エンジニア目線の情報発信をしています! https://youtube.com/channel/UCGnKrBlfJWq05hFB5kpzsPQ

マガジン

  • DjangoとVue.jsでTodoアプリを作ろう

    DjangoとVue.jsで作るTodoアプリの作り方を紹介したマガジンです。

  • 未経験からwebエンジニアになった話

    未経験からエンジニアになるまでの話を書いたnoteです

記事一覧

固定された記事

未経験からwebエンジニアになるためにやったこと【面接編】

はじめに2020年4月からwebエンジニアとして働きはじめ、今はスタートアップのバックエンドエンジニア(2021年10月現在)として働いている、かよちんといいます。 このnoteで…

500
かよ
3年前
13

DjangoとVue.jsでシンプルなTodoアプリを作る 09.VueでTodo削除機能を実装する

前回の記事では、データを更新できるようにしました。 いよいよ、最後の機能としてタスクを削除する機能を作っていきたいと思います。 下記の流れで実装を進めていきます…

250
かよ
2年前
4

DjangoとVue.jsでシンプルなTodoアプリを作る 08.VueでTodoデータを更新する

前回の記事で、task の一覧を取得、作成することができました。 https://note.com/kcatyo/n/n2c459d8dca97 しかし、todo リストなら、完了した todo にチェックを入れら…

250
かよ
2年前
3

DjangoとVue.jsでシンプルなTodoアプリを作る 07.VueでTodo作成機能を実装する

前回の記事ではVueでタスクを取得する方法について書きました。 続いて、タスクを作成する機能を Vue で作っていこうと思います。 一覧を取得するのとほとんど同じ流れで…

かよ
2年前
4

DjangoとVue.jsでシンプルなTodoアプリを作る 06.VueでTodoデータを取得する

前回の記事では、django と HTML で、task を作成し、作成したものを一覧で表示することができるようになりました。 ですが、まだ 1 クリックで task を完了にさせたり、…

かよ
2年前
2

DjangoとVue.jsでシンプルなTodoアプリを作る 05.DjangoだけでTodo一覧・作成機能を実装する

前回の記事では、Djangonの管理画面を使用して、データを登録できるようにしました。 今回の記事では、Vueを使用せず、Djangoのみで登録したデータを取得、作成できるよう…

かよ
2年前
6

DjangoとVue.jsでシンプルなTodoアプリを作る 04.Djangoでデータを登録しよう

前回の記事では、html をbootstrapで整え、views.pyとurls.pyにコードを書いて、Djangoを通してhtmlに文字を表示できるようにしました。 今回の記事では、Django でデータ…

かよ
2年前
6

DjangoとVue.jsでシンプルなTodoアプリを作る 03.Djangoで文字を表示させよう

前回の記事では、アプリを作るセットアップをしていきました。 今回は、html をbootstrapで整え、views.pyとurls.pyにコードを書いて、Djangoを通してhtmlに文字を表示で…

かよ
2年前
7

未経験webエンジニアが1年で転職した結果。

私は、業務未経験からwebエンジニアとして企業で働き、約1年で別の企業に転職しました。 このnoteでは、 未経験から転職するのに苦労したか? 年収は上がったか? 言語と…

かよ
2年前
17

DjangoとVue.jsでシンプルなTodoアプリを作る 02.Djangoセットアップ

前回の記事はこちら setupはじめにアプリのセットアップをします。 初めてPythonに触れる方は、最初だけ少し大変ですが、頑張ってください! Python3をダウンロードpython…

かよ
2年前
8

DjangoとVue.jsでシンプルなTodoアプリを作る 01.作れるもの・学べることの紹介

このチュートリアルで作るものPythonのフレームワークであるDjangoと、JavaScriptのフレームワークであるVue.jsを使ったSPA todoアプリです。 Djangoについてよくわからな…

かよ
2年前
9

英語力0でもできた。英語でプログラミングを学べる方法

はじめに海外のプログラミング情報を知れるようになりたいと思い、はや一年。 試行錯誤して、なんとか学べる方法を見つけたので、3つご紹介します。 1.クローム拡張機能を…

かよ
2年前
17

【ポートフォリオは設計が8割】webエンジニアになるためのポートフォリオ設計方法 後編

webエンジニアを未経験から目指す際、ポートフォリオが必要になると思います。 プログラミングを勉強できる教材はたくさんあっても、 どんな設計方法でオリジナルサービス…

500
かよ
3年前
6

webエンジニアのポートフォリオの作り方【設計編】〜設計作業とは?サービスのコンセプトの整理〜

webエンジニアを未経験から目指す際、ポートフォリオが必要になると思います。 でも、どんな手順でポートフォリオを作るか体系的に学べる記事って意外と少ないですよね。 …

かよ
3年前
29

HSPの私が、一歩踏み出す時に、勇気をもらった言葉たち。

HSPとは、Highly Sensitive Person(ハイリー・センシティブ・パーソン)といい、「ひといちばい繊細な人」という意味です。 今回は、そんなHSPの私を励まして、新しいこ…

かよ
4年前
31

【後編】普通の女子大生だった私が、WEBエンジニアをファーストキャリアに選んだ訳。

前回に続き、私がWEBエンジニアとして内定をいただくまでのことを書いていきたいと思います。 エンジニア職を志すも、 何をすればいいか、わからなかった3ヶ月WEB系のエン…

かよ
4年前
20
未経験からwebエンジニアになるためにやったこと【面接編】

未経験からwebエンジニアになるためにやったこと【面接編】

はじめに2020年4月からwebエンジニアとして働きはじめ、今はスタートアップのバックエンドエンジニア(2021年10月現在)として働いている、かよちんといいます。

このnoteでは、未経験からエンジニアになった私が、技術力がない中、面接を突破してRuby on Railsを使った自社開発企業のwebエンジニアになれた方法を、面接に集中してお話したいと思います。

また、私自身、エンジニアをとし

もっとみる
DjangoとVue.jsでシンプルなTodoアプリを作る 09.VueでTodo削除機能を実装する

DjangoとVue.jsでシンプルなTodoアプリを作る 09.VueでTodo削除機能を実装する

前回の記事では、データを更新できるようにしました。

いよいよ、最後の機能としてタスクを削除する機能を作っていきたいと思います。
下記の流れで実装を進めていきます。

もっとみる
DjangoとVue.jsでシンプルなTodoアプリを作る 08.VueでTodoデータを更新する

DjangoとVue.jsでシンプルなTodoアプリを作る 08.VueでTodoデータを更新する

前回の記事で、task の一覧を取得、作成することができました。

https://note.com/kcatyo/n/n2c459d8dca97

しかし、todo リストなら、完了した todo にチェックを入れられるようにしなければいけません。

今回は、完了した task にチェックを入れて完了にしたり、チェックを外して、未完了の状態に戻せるようにできるようにします。

下記のような流れで

もっとみる
DjangoとVue.jsでシンプルなTodoアプリを作る 07.VueでTodo作成機能を実装する

DjangoとVue.jsでシンプルなTodoアプリを作る 07.VueでTodo作成機能を実装する

前回の記事ではVueでタスクを取得する方法について書きました。

続いて、タスクを作成する機能を Vue で作っていこうと思います。
一覧を取得するのとほとんど同じ流れで、下記の流れでコードを書いていきます。

html→Vue に task のタイトルを送れるようにする

Vue で task を作成する createTask メソッドを定義

html→Vue で送られてきた新しい task

もっとみる
DjangoとVue.jsでシンプルなTodoアプリを作る 06.VueでTodoデータを取得する

DjangoとVue.jsでシンプルなTodoアプリを作る 06.VueでTodoデータを取得する

前回の記事では、django と HTML で、task を作成し、作成したものを一覧で表示することができるようになりました。

ですが、まだ 1 クリックで task を完了にさせたり、削除したりする機能はできていません。

ここからは、django と HTML のみで実装するのではなく、Vue.js を使用して、task の一覧を表示、作成、更新、削除を画面の遷移なしでできるようにしたいと思

もっとみる
DjangoとVue.jsでシンプルなTodoアプリを作る 05.DjangoだけでTodo一覧・作成機能を実装する

DjangoとVue.jsでシンプルなTodoアプリを作る 05.DjangoだけでTodo一覧・作成機能を実装する

前回の記事では、Djangonの管理画面を使用して、データを登録できるようにしました。

今回の記事では、Vueを使用せず、Djangoのみで登録したデータを取得、作成できるようにしていきたいと思います。

まず、task/templates/task_list.html に、下記を追記してください。

task/templates/task_list.html

{% extends 'base

もっとみる
DjangoとVue.jsでシンプルなTodoアプリを作る 04.Djangoでデータを登録しよう

DjangoとVue.jsでシンプルなTodoアプリを作る 04.Djangoでデータを登録しよう

前回の記事では、html をbootstrapで整え、views.pyとurls.pyにコードを書いて、Djangoを通してhtmlに文字を表示できるようにしました。

今回の記事では、Django でデータを登録できる仕組みを担っている、models.py を作成し、Django の管理画面から、データを登録できるようにします!

その前に、前回の記事で、ビューについて説明し忘れていた部分がある

もっとみる
DjangoとVue.jsでシンプルなTodoアプリを作る 03.Djangoで文字を表示させよう

DjangoとVue.jsでシンプルなTodoアプリを作る 03.Djangoで文字を表示させよう

前回の記事では、アプリを作るセットアップをしていきました。

今回は、html をbootstrapで整え、views.pyとurls.pyにコードを書いて、Djangoを通してhtmlに文字を表示できるようにします!

bootstrapでhtmlを整えるまず、前回作成した、 templates > base.html にコードを書いていきます。

base.html 内で!を入力し、下記の h

もっとみる
未経験webエンジニアが1年で転職した結果。

未経験webエンジニアが1年で転職した結果。

私は、業務未経験からwebエンジニアとして企業で働き、約1年で別の企業に転職しました。

このnoteでは、

未経験から転職するのに苦労したか?

年収は上がったか?

言語と、担当分野を保守から開発に変わったけど、どれくらいでなれたか?

など、

webエンジニアの方で今後転職される方や、これからwebエンジニアを目指そうと考えている方が気になるであろう事を、自分が体験したことを元に話してい

もっとみる
DjangoとVue.jsでシンプルなTodoアプリを作る 02.Djangoセットアップ

DjangoとVue.jsでシンプルなTodoアプリを作る 02.Djangoセットアップ

前回の記事はこちら

setupはじめにアプリのセットアップをします。
初めてPythonに触れる方は、最初だけ少し大変ですが、頑張ってください!

Python3をダウンロードpython3をダウンロードしていない方は、Djangoで開発をするために、事前にダウンロードしてください。

DjangoはPythonが元になって作られたもの。
つまりニワトリとひよこみたいな関係なので、開発するのがD

もっとみる
DjangoとVue.jsでシンプルなTodoアプリを作る 01.作れるもの・学べることの紹介

DjangoとVue.jsでシンプルなTodoアプリを作る 01.作れるもの・学べることの紹介

このチュートリアルで作るものPythonのフレームワークであるDjangoと、JavaScriptのフレームワークであるVue.jsを使ったSPA todoアプリです。

Djangoについてよくわからない方はこちらの動画で説明しています!

一般的には、DjangoとVueを使って開発する場合、Django REST frameworkを使うことが多いですが、

前提知識などが必要でハードルが高

もっとみる
英語力0でもできた。英語でプログラミングを学べる方法

英語力0でもできた。英語でプログラミングを学べる方法

はじめに海外のプログラミング情報を知れるようになりたいと思い、はや一年。
試行錯誤して、なんとか学べる方法を見つけたので、3つご紹介します。

1.クローム拡張機能を使って、海外のプログラミング動画をみる海外のプログラミング動画はたいてい日本語訳がないのですが、この拡張機能を使えば一瞬で日本語に変換され、どの動画でも日本語でみることができます。

■Language Learning with N

もっとみる
【ポートフォリオは設計が8割】webエンジニアになるためのポートフォリオ設計方法 後編

【ポートフォリオは設計が8割】webエンジニアになるためのポートフォリオ設計方法 後編

webエンジニアを未経験から目指す際、ポートフォリオが必要になると思います。

プログラミングを勉強できる教材はたくさんあっても、
どんな設計方法でオリジナルサービスを作ればいいか体系的に学べる記事は少なく、ポートフォリオ作成に困ることが多いと思います。

このシリーズでは未経験からwebエンジニアになった私が、
初心者目線でポートフォリオの作り方を解説します。

今回の記事ではポートフォリオを作

もっとみる
webエンジニアのポートフォリオの作り方【設計編】〜設計作業とは?サービスのコンセプトの整理〜

webエンジニアのポートフォリオの作り方【設計編】〜設計作業とは?サービスのコンセプトの整理〜

webエンジニアを未経験から目指す際、ポートフォリオが必要になると思います。

でも、どんな手順でポートフォリオを作るか体系的に学べる記事って意外と少ないですよね。

このシリーズでは未経験からwebエンジニアになった私が、
初心者目線でポートフォリオの作り方を解説します。

今回の記事ではポートフォリオを作る流れと、
ポートフォリオを作る際にはじめに行う設計方法について説明します!

動画でサラ

もっとみる
HSPの私が、一歩踏み出す時に、勇気をもらった言葉たち。

HSPの私が、一歩踏み出す時に、勇気をもらった言葉たち。

HSPとは、Highly Sensitive Person(ハイリー・センシティブ・パーソン)といい、「ひといちばい繊細な人」という意味です。

今回は、そんなHSPの私を励まして、新しいことに挑戦するきっかけになった言葉を紹介します。

1.人と違うことにチャンスがある思春期から、人と違うところや、周りに合わせられない自分が嫌でした。

ですが、今の時代は周りに合わせられる協調性が高い人だけでは

もっとみる
【後編】普通の女子大生だった私が、WEBエンジニアをファーストキャリアに選んだ訳。

【後編】普通の女子大生だった私が、WEBエンジニアをファーストキャリアに選んだ訳。

前回に続き、私がWEBエンジニアとして内定をいただくまでのことを書いていきたいと思います。

エンジニア職を志すも、
何をすればいいか、わからなかった3ヶ月WEB系のエンジニアになりたいなと思い始めたのですが、
具体的に何をやればいいかわかりませんでした。

周りにエンジニアになりたい人はいましたが、
SIerを目指す人だけでした。

その時は、 WEB系もSIerと同じで、
プログラミングスキル

もっとみる