すべてのカテゴリ

Dartって？こんにちは。ackey_mです。いきなりですがDartというプログラミング言語をご存じでしょうか？2011年にGoogleで作られたプログラミング言語で、JavaScriptの替わりという位置づけで作られた言語なのだそうです。残念ながらその時にはあまり普及せず、今ではTypeScriptのほうが広く知られているかと思います。しかし、すでに廃れてしまったというわけではまったくありません！Dartはこれから盛り上がる？Flutterというモバイルアプリケーションフレームワークがあり、それに採用されている言語がDartなのです。また、Googleが開発中である新OSの「Fuchsia」はDartで作られていて、そのUIやアプリケーションはflutterで作られているのだとか。Googleが開発した主流のOSといえばAndroidですが、もしそのFuchsia（なんて読むんだ）が取って替わったときにはDartやflutterがものすごく流行するかもしれませんね！コスパの良さは抜群！FlutterFlutterはアプリの開発効率が非常に良いことで知られています。・iOS、Androidなどのネイティブアプリのほか、webアプリやデスクトップアプリの作成も可能なクロスプラットフォーム・豊富なウィジェットがそろったUI・アプリを再起動しなくても修正が反映される、ホットリロードなど、特に個人開発など小規模な開発ではすばらしいパフォーマンスを発揮してくれそうです！洗練されたウィジェットたち私がとても感動したのが、Flutterに用意された超強力なウィジェットの数々です。おしゃれなデ

こんばんは。今回は教科別スケジュールのページです。いわゆる学習指導要領が科目別に確認追加編集できるページになっています。右側の項目から参照したい科目を選択します。試しに国語を選択してみます。これも今月の授業内容が初期表示されるようになっています。こちらはこの画面で全て内容を確認できるようにしています。⚙マークで編集画面↓登録画面は科目を選択できるようになっています。そしてこれまで同様に情報を登録していきます。目指しているのはアプリ内で授業の準備が全て整う状態にできることです。将来的には学習資料を更新・検索・リンク付・印刷までできるようにして、授業の下準備が効率的に行えるようなシステムを作っていきたいです。今回は以上です。ありがとうございました！

　こんにちは、今回から少しずつLaravelでの学校や塾向け業務効率化Webアプリ開発の過程をここに残していきたいと思います。　Laravelを学び始めた人や、プログラミングに興味がある初心者の方にわかりやすい内容を発信できればと思います　　　　　　（僕は全て独学です！誰でもできます！！！）。　兎にも角にも今回はこのアプリケーションで何ができるのかを紹介していきたいと思います。　top画像の左にあるのが用意しているメニューです。⬇︎こちら（きっかけはいつも日本の学校の先生って仕事量の多さが異常に多いなと思っていて、それを解決できるアプリ作ったら面白そうだなと思ったからです。ちなみに文部科学省の『教員が担うべき業務』を読んで内容を考えました。）それぞれの大まかな内容として•トップページ 　--  今日の天気、予定、行事などが閲覧できるページ•クラスページ　--　先生が担当のクラスに関する情報が閲覧できる•成績管理　　　--   クラスの成績管理閲覧ページ•学校行事　　　--   学校行事の詳細を閲覧できるページ•カレンダー　　--  予定一覧がカレンダーで確認できるページ•メッセージ　　--  メールのような機能をつけたい（まだ開発していません）•職員フォロー　--  教員同士の掲示板のようなページ•指導要領　　--授業で必要なプリントなどを選べる（まだ開発していません）•情報登録画面　--  各情報の登録ページトップページクラスページ成績管理学校行事職員フォロー情報登録画面　こんな感じの見た目で開発しており、使いさすさシンプルさ、直感的な操作性を意識して見た目を整えています。　

みなさん、こんにちは。ノーコード でモバイルアプリを開発させて頂いています、西澤志門です。今回は、少し尖った題材「なぜ今、ノーコード で開発をすべきなのか」について、詳しく解説していきます。新しいビジネスを開始する際には、開発に関連する多くの問題が発生します。例えば、開発には時間とお金がかかり、技術的な知識が必要で、人材不足という課題があります。しかし、このような問題は、ノーコード開発ツールを使用することで解決できます。この記事では、新規事業でノーコード開発を選択する理由について詳しく説明します。目次記事を読んで欲しい人大前提、、コスト削減開発期間の削減爆速に回せるPDCAユーザビリティーリスクの軽減最後に記事を読んで欲しい人ノーコード で開発しようか悩んでいる方新規事業を始めようと思っている方ノーコード に関して詳しく知りたい方大前提、、大前提、新規事業や起業の成功率は、約10％と言われています。つまり、90％の新規事業/起業時のサービスは使われずに「失敗」と言われてしまいます。では、失敗の要因は何でしょうか。もちろん、各新規事業や各起業時のサービスによって様々ではありますが、大きな要因として「ニーズ不足」が挙げられます。そもそも、新規事業/起業時のサービスで解決できる課題が、そこまで解決を望まれていない課題だった、新規サービス自体にニーズがなかったということです。ニーズ不足が原因で、新規事業の失敗や起業の失敗につながることが多くあります。ではどうするべきか。答えは簡単で、「ニーズの検証」をすべきです。自ら仮説を立て、その仮説を検証し、事実を確認といったようなプロセスを爆速に

みなさんこんにちは。イプシロンです。最近は、VBAやSeleniumに関する記事ばかり書いているので、気分転換にFirebaseについても触れていきたいと思います。それでは、いってみましょう！！！Firebaseとは？Firebaseとは、Google社が提供している、スマートフォンアプリやWebアプリケーションにおける「バックエンド開発」において、スピードの向上とコスト削減を可能にするプラットフォームです。私も、ココナラでwebアプリケーション開発のサービスを出品させていただいておりますが、バックエンドにはこのFirebaseを使用しております。バックエンド環境とは？ちなみに、バックエンド環境とは、ユーザーには見えない、アプリの裏側の動作のことを指します。SNSアプリでユーザー情報の管理、「お気に入り登録」機能や、「いいね」機能、「コメント」機能なんかでこのバックエンド環境が活用されています。Firebaseを利用するメリットざっくりですがメリットは下記のとおりです。・サーバー管理や保守が不要になる。・エンジニアの負担を大きく軽減できる。・規模に応じた従量課金性のためリーズナブル(勉強、お遊び程度なら無料の範囲でできる。)・アナリティクスやデータベース、クラウドメッセージング、クラッシュレポートなど複数の機能が提供されている。といったところでしょうか。Firebaseで出来ること&機能Firebaseの主な機能と概要、できること、そしてメリットについてなど、各機能をご紹介します。・Firebase Realtime Databaseクラウドホスト型NoSQLデータベー

LIFFアプリってなに？LIFFアプリって聞いたことありますか？LIFFは「LINE Front-end Framework」の略で、LINE社が提供する提供するウェブアプリケーションのプラットフォームです。LIFFを使って動作するアプリケーションを「LIFFアプリ」と呼びます。LINEミニアプリと何が違うの？LIFFアプリとLINEミニアプリの違いは以下のとおりです。出典：LINE API Use Caseエンドユーザ視点ではあまり変わりませんが、サービス提供者視点ではLINEによる審査および認定の有無が特に大きな違いかと思います。LIFFのメリットは？（エンドユーザ視点）エンドユーザのメリットとしては、以下のようなことが挙げられます。・LINE上からブラウザなど他のアプリに遷移することなく、シームレスに利用できる・ログインなどは不要で簡単にシステムを利用することできるLIFFのメリットは？（サービス提供者視点）サービス提供者のメリットとしては、以下のようなことが挙げられます。・LINEのユーザー情報を取得でき、顧客情報を連携することができる ・メッセージの配信などをLINEで行うことができるため、顧客へのアプローチがしやすい LIFFで何ができるの？１．LINE公式アカウントにWEBアプリを連携することができるLINE公式アカウントのリッチメニューにLIFFアプリのリンクを設定しておくことで、ユーザはそのトークルーム内で、メニューをタップするだけでLIFFアプリを利用することできます。これにより、LINEと他のアプリを行き来することなく、LINEのトークルーム内だけで完結さ

今回はクラスページのクラス予定に関するページについて紹介したいと思います。ここのページではクラスの予定のみが閲覧できるようになっています。それでは見ていきましょう。まずは基本のビジュアルから⬇︎月毎に閲覧できるようになっており、今月の予定が初期表示されるような仕様になっています。予定名、予定日のみが表示されるようにし、選択すると詳細が表示されます。こんな感じです⬇︎こちらの詳細ページで詳しく内容が確認できます。右側の⚙マークを押すと...⬇︎編集ページになっています。こちらですぐに内容変更ができるようになっておりアクセスしやすくしました。では登録画面を見ていきましょう⬇︎バリデーション(バリデーションは未入力のチェックや数字の半角指定などを判定する機能のことです！！)付きの情報入力画面です。確認ページ⬇︎(＊全画面に戻った時のセッションについてはコード解説の時に解説します)登録ページ⬇︎情報が反映されました⬇︎　予定をクラスごと、試験ごとなど分けていますがここに関して全て統一した予定でもいいのではないかとも思いましたが、例えば朝礼、夕礼での先生の話さなければならないことをすぐに確認できるのは便利だなと思い予定を細かく分けました。先生がいかに一つの仕事に集中できるかここが大事なのかなと思います。　こういうどうしたら先生の多すぎる業務を効率化できるか？と言う問に対してシチュエーションを想定しながらアプリの仕様を考えると、具体的な仕様が見えてきます(月毎表示の方がいいのではないか、すぐに内容修正をかけられた方がいいのではないか等)。次回は授業スケジュールのビジュアル紹介です。ありがと

Webアプリや社内ツールを作りたいと思ったとき、費用と同じくらい気になるのが「どれくらいの期間で完成するのか」だと思います。「小さな管理画面ならすぐ作れるのか」「Excelで管理している業務をWeb化すると、何週間くらいかかるのか」「できるだけ早く使いたいけれど、どこまで準備すればよいのか」「依頼してから納品まで、どんな流れで進むのか」このあたりが分からないと、なかなか相談しづらいですよね。結論から言うと、Webアプリ開発の期間は、作る内容によって大きく変わります。ただし、社内で使う小さな業務改善ツールであれば、最初から大規模に作る必要はありません。入力フォーム、一覧表示、検索、CSV出力など、必要な機能に絞れば、比較的短い期間で形にできることもあります。一方で、ログイン、権限管理、通知、画像アップロード、外部サービス連携、複雑な集計などが増えると、その分だけ確認や実装に時間がかかります。小さな社内ツールであれば、まずは「どこまで作るか」を決めることが大切です。たとえば、シンプルな問い合わせ管理ツールの場合、必要な機能は次のようなものです。問い合わせを登録する。一覧で確認する。ステータスを変更する。担当者で絞り込む。CSVで出力する。このくらいの内容であれば、比較的小さく作りやすいです。一方で、ユーザーごとに見える情報を変えたい。メール通知を送りたい。スマホでもかなり使いやすくしたい。画像やPDFも保存したい。グラフで集計したい。外部サービスと連携したい。このような要望が増えると、画面設計、データ設計、テスト、調整の時間も増えていきます。つまり、開発期間は「Webアプリだから何

Webアプリを作りたいと思ったとき、最初に気になるのはやはり費用だと思います。「社内ツールを作りたいけれど、いくらくらいかかるのか分からない」「Excel管理をWebアプリにしたいけれど、高額になりそうで不安」「小さな管理画面だけでも依頼できるのか知りたい」「どこまでお願いすると金額が上がるのか知っておきたい」このように、開発を依頼する前の段階で費用感が分からず、相談するかどうか迷っている方は多いです。Webアプリ開発と聞くと、大きなシステム開発を想像してしまうかもしれません。もちろん、本格的な業務システムや大規模なサービスを作る場合は、費用も期間も大きくなります。ただ、社内で使う小さな業務改善ツールであれば、必要な機能に絞って作ることもできます。たとえば、問い合わせを一覧で管理する画面。日報をスマホから入力するフォーム。在庫数を登録・検索する管理画面。CSVを取り込んで一覧表示するツール。Excelの代わりに複数人で確認できるWeb画面。こういった小さな社内ツールであれば、いきなり大規模な開発にする必要はありません。費用は作る内容によって大きく変わりますが、考え方としては、まず「どこまで作るか」で変わります。たとえば、入力フォームと一覧表示だけのシンプルなもの。これは比較的小さく作りやすいです。一方で、ログイン機能、権限管理、検索、CSV出力、画像アップロード、承認フロー、通知機能、外部サービス連携などが増えると、その分だけ設計や実装、確認作業が増えます。つまり、Webアプリ開発の費用は、単純に「画面があるかどうか」ではなく、どんなデータを扱うのか。何人で使うのか。どんな操作

Excelはとても便利です。一覧管理、集計、帳票作成など、ちょっとした業務改善なら十分に活躍してくれますし、実際に多くの会社で日常的に使われています。ただ、業務が少しずつ増えてくると、「Excelで回しているけれど、そろそろ厳しいかもしれない」と感じる場面が出てきます。たとえば、こんなことはありませんか？・同じファイルを複数人で触るので、どれが最新か分からなくなる・ファイルをメールやチャットで送り合っていて管理が煩雑・入力ルールが人によってバラつく・スマホから確認や入力がしづらい・検索しづらく、過去データを探すのに時間がかかる・担当者が変わると運用が止まりやすい最初はExcelで十分だった業務でも、利用人数やデータ量が増えると、管理方法そのものを見直した方がよいケースがあります。そのときの選択肢のひとつが、Webアプリ化です。では、どんな業務がWebアプリ化に向いているのでしょうか。まず分かりやすいのは、「複数人で同じ情報を扱う業務」です。Excelは個人作業には強いですが、複数人で同時に運用するとなると、どうしても無理が出やすいです。たとえば、在庫管理、顧客管理、問い合わせ管理、日報入力、案件管理、予約管理などは、複数人が同じ情報を更新することが多いため、Webアプリとの相性が良いです。Webアプリにすると、同じデータを共通で管理しやすくなり、「最新版がどれか分からない」といった問題を減らせます。次に、「入力する人」と「見る人」が分かれている業務も、Webアプリ化を検討しやすいです。たとえば、現場スタッフが入力して、事務担当が確認する。店舗スタッフが日々の数字を入れて、本部側

ご覧いただきありがとうございます。公認ノーコード Adaloエキスパートの西澤志門です。近年、DX（デジタル・トランスフォーメーション）が必須だと騒がれ、あらゆる業界でDXの加速度をあげていく必要がある中で、圧倒的にDX人材が足りていません。そのような中で、スマホアプリ/Webアプリ等を「低コスト」「短期間」で開発できる「ノーコードツール」が注目を浴びています。本記事では、ノーコードにてシステムを開発するメリットとデメリットを徹底的に詳しく解説します。最後まで一読ください。そもそもノーコードとは？ノーコードとは？ノーコードとは、「コードを書かかずに（プログラミングをせずに）スマホアプリやWebアプリを開発する技術のこと」です。従来のスマホアプリやWebアプリを開発するためには、コードを書いて（プログラミング技術を使って）開発する必要があります。さらに、安くて数百万円～数千万円の開発コストと短くて半年～数年の開発期間を要するのも、コードによる開発の特徴です。しかし、ノーコードの技術を活用すれば、はるかに「低コスト」「短期間」でスマホアプリやWebアプリを開発することができます。また、学習コストも低く、DXの推進を加速していく必要がある中で、非常に効果的な技術だと言えます。ノーコードとローコードの違いとは？「ノーコード」と同時に「ローコード」という言葉も耳にされたことがあると思います。ローコードとは、「一部コードを書いて（プログラミング技術を使用して）スマホアプリやWebアプリを開発する技術のこと」です。上記のように、ローコード開発では、少々コードを書く技術が必要になってきます。そ

こんばんは、今日は授業スケジュールページのご紹介です。授業スケジュールページは写真のように時間割が確認できるのと、各科目の授業計画が確認できるようになっています。今回は時間割ページを紹介します。時間割ページはかなりシンプルで、編集・登録ページは写真のようになっています。最終的にはTOPページの今日の予定欄のところに時間割が表示される予定です。今日は短いですが時間割ページのご紹介でした。

ココナラで業務改善や自動化のご相談を受けるようになって、気づけば約1年が経ちました。最初にココナラを始めたきっかけは、本業でシステムエンジニアとして働いている経験を、副業にも活かせるのではないかと思ったことです。システム開発や業務効率化に関わる中で、ExcelやGoogleスプレッドシート、GAS、Webアプリなどを使えば、日々の作業をもっとラクにできる場面は多いと感じていました。ただ、実際に副業として始めるとなると、不安もかなりありました。本当に受注できるのか。金額はいくらにすればよいのか。お客様は何を求めているのか。自分のスキルで満足してもらえるのか。最初は分からないことばかりでした。そのため、はじめはExcelやGASの比較的小さな案件から受けるようにしていました。いきなり大きなシステムを作るというよりも、まずは今あるExcel作業をラクにする、毎月の集計を自動化する、手作業の転記を減らす、そういった身近な業務改善から取り組んできました。実際にご相談を受けてみて感じたのは、業務改善の悩みは本当にさまざまだということです。自分が思っていたよりも、すごく単純な部分の自動化を求められることもありました。たとえば、毎回同じ作業を繰り返している、CSVを加工している、Excelの入力や集計に時間がかかっている、というような内容です。一方で、専門的な業界ならではの自動化のご相談もありました。普段自分が触れていない業界の業務を知る機会もあり、「まだまだ知らない仕事の流れがたくさんあるんだな」と感じました。印象に残っているものとしては、複数サイトの情報を取得するスクレイピングのご相談、勤

久しぶりの投稿なので簡単に自己紹介すると、最近は主にGPT-3 (生成AIのAPI)を使ったWebアプリケーション（Django）開発や、それを解説した技術ブログの寄稿を主にやらせていただいておりますべナオと申します。今回のブログでは、ココナラさんで実際に仕事をお受けした時の体験談を、そこまでの経緯も合わせて紹介したいと思います。想定する読者さんは、以下のような方です。 ・「Pythonエンジニアの働き方に興味がある」 ・「Pythonエンジニアの普段見れない裏側を知りたい」 ・「暇つぶしにべナオの記事でも読んでみるか」1. 外部サイトでPythonの記事を3年書き続けていたらネットで依頼が来るようにもともとは外部の某ブログサイトでPythonの技術ブログを趣味で書いていました。扱うテーマはチャットボットや機械学習やSNS分析などです。始めた当時（４年前）は今ほど日本のPythonエンジニアが多くなかったので、ネットで公開するだけでPVが伸びていたのを覚えています。それからも自作のプログラムを中心に、技術ブログを数ヶ月おきに書いてきました。ほとんどのnoteは無料で、自分の知識の整理やSNSを介しての他のエンジニアの方との交流を目的として地味に続けてきました。 知り合いのバーを借りて、エンジニア向けの交流会を開いてパスタを自分で作ってお客さんに出していたりもしました(料理は今でも好きです)。 そんなこともあってTwitterで少しは目立っていたのか、IT系の方にフォローされることが増えていきました。そこでこんなことを思いついたのです。 「これだったらネットで仕事を受ける窓口さ

先日GitHubで公開したプログラムにGUIを付けようと、PythonのWebアプリ開発環境を作り頑張っています。virtualboxで作ったUbuntu22.04の環境。、Pythonの開発環境をVSCODEを使って作りました。フレームワークのFlaskを使って、Webアプリを作ることができるようになりました。私も地道に、アプリ開発を続けています。

社内ツールやWebアプリは、作って終わりではありません。もちろん、最初にしっかり作ることは大切です。入力しやすい画面、見やすい一覧、検索機能、CSV出力、スマホ対応など、業務に合った形で作れれば、日々の作業はかなりラクになります。ただ、実際に業務で使い始めると、あとから気づくことも多いです。「この項目も追加したい」「一覧の並び順を変えたい」「スマホだと少し押しづらい」「CSVの形式を変更したい」「担当者が増えたので権限を分けたい」「エラーが出たときに原因を確認したい」こういったことは、社内ツールではよくあります。Webアプリは、公開して終わりではなく、実際の運用に合わせて少しずつ調整していくものです。そのため、作ったあとに必要になる「保守」や「運用」の考え方を知っておくことはとても大切です。まず、保守で一番分かりやすいのは、不具合対応です。たとえば、ボタンを押しても反応しない。特定の条件で保存できない。表示される数字が想定と違う。スマホで見たときにレイアウトが崩れる。CSVを取り込んだらエラーになる。このような問題が出たときに、原因を確認して修正する作業が必要になります。特に社内ツールの場合、実際のデータを入れてみて初めて分かる不具合もあります。開発中は問題なく動いていたとしても、実運用では想定外の入力や例外データが出てくることがあります。日付の形式が違う。空欄が入っている。同じ名前のデータが複数ある。想定より件数が多い。画像やファイルのサイズが大きい。こうしたケースに対応していくのも、保守の大事な役割です。次に必要になるのが、小さな改善です。社内ツールは、実際に使ってみると「

「社内ツール」や「Webアプリ」と聞くと、少し大きなシステムを想像される方も多いかもしれません。何百万円もかけて作る業務システム。専用サーバーが必要な大規模な仕組み。社内全体で導入するような本格的なシステム。もちろん、そういった開発もあります。ただ、実際にはもっと小さな形でも、業務改善に役立つWebアプリは作れます。たとえば、今Excelで管理している業務を、少しだけ使いやすい入力画面にする。複数人が同じ情報を見られる一覧画面を作る。スマホから入力できる報告フォームを作る。検索や履歴確認がしやすい管理画面を作る。このような小さな社内ツールでも、日々の手間をかなり減らせることがあります。Excelは便利ですが、複数人で使い始めると、だんだん困る場面が出てきます。「誰が最新ファイルを持っているのか分からない」「メールやチャットでファイルを送り合っている」「入力ミスや記入漏れが多い」「過去の履歴を探すのに時間がかかる」「スマホから確認しづらい」「担当者が変わると運用が分からなくなる」こういった悩みが出てきたら、Webアプリ化を検討するタイミングかもしれません。では、小さな社内ツールとして、どんなものが作れるのでしょうか。まず分かりやすいのが、問い合わせ管理や案件管理です。たとえば、お客様からの問い合わせをExcelやメールで管理している場合、対応漏れや二重対応が起きやすくなります。Webアプリにすると、問い合わせ内容、担当者、対応状況、期限、メモ、履歴などを一覧で管理できます。「未対応だけ表示する」「担当者ごとに絞り込む」「対応済みの履歴を確認する」「過去のやり取りを検索する」こうい

Web開発を学びたいけれど、「何から始めたらいいか分からない」という人も多いと思います。この記事では、個人でWeb開発を始めるために必要な基本ステップを、具体的に分かりやすく解説していきます。本記事を参考にすれば、Web開発者になるための道筋が見えると思いますので是非参考にして下さい。1. Webアプリ開発とは？Webアプリとは、ブラウザ上で動作するアプリケーションのことです。私たちが日常的に使っているものには、SNS、ショッピングサイト、ブログ、タスク管理アプリなどが含まれます。これらのアプリは全てサーバー上で動作し、ブラウザを通じてユーザーが操作します。サーバーとは、Webアプリのデータなどが保存されている場所です。実際に世界のどこかに物理的に存在しています。Webアプリは、基本的に次の2つの技術で成り立っています：フロントエンド（ユーザーの目に見える部分）ユーザーが実際に目にする部分で、ブラウザ上で動作します。HTML、CSS、JavaScriptなどを使用して作成されます。バックエンド（サーバー側の処理）Webアプリでは、ユーザーが見えないところで複雑な処理を行なっています。例えば、TwitterやInstagramで、ユーザーから投稿されたら、その情報がデータベースに保存され、世界中の人がその投稿を見れるようになるわけですそのような処理をバックエンドと呼びます。Python、Ruby、JavaScriptなどのプログラミング言語で開発されます。2. HTML、CSS、JavaScriptを学ぶ次に、Webアプリの基本となる技術を学びます。これらはユーザーから見える部分

こんばんは、公認ノーコード Adaloエキスパートの西澤志門です。今回は、ノーコード で開発されたアプリの事例をご紹介します。カテゴリーごとに分けてご紹介しますので、最後までご覧いただけると幸いです。マッチングアプリケーションSPOTTO（就活生と企業を結ぶマッチングアプリ ）【概要】SPOTTOとは、ノーコードによって開発された就職活動中の学生と採用している企業を繋げるマッチングアプリケーションです。特に、日本におけるノーコードで開発されたアプリケーションの中で、初めて買収されたアプリケーションとしても注目を集めました。実際に、買収した企業の方は、「僕は「ノーコードで開発されているけどクオリティが低い」みたいな状態だったら買収してませんでした(笑)実際に完成したアプリを見てみると、ノーコードだと気づかないくらいのクオリティだったんですよ。」とコメントされています。ノーコードでもかなりクオリティの高いアプリケーションを「低コスト」「短期間」で開発できると言えるでしょう。(ノーコードで開発するメリット等も解説させて頂いていますので、ぜひご覧ください。)【開発期間】・約1か月（要件定義～仮説検証による修正まで）要件定義から、ニーズの仮説検証まで約1か月で実践できてしまうスピードの観点では、ノーコードの特権と言えるでしょう。まさに「短期間」「高クオリティ」の開発を実現したノーコード開発の例と言えます。【開発言語】・AdaloSPOTTOはノーコード開発ツールAdaloにて開発されたアプリケーションです。Adaloでは、「低コスト」「短期間」「高クオリティ」でのアプリケーションの開発を

はじめに今までVBAやGASなどでツールの作成はしたことあるのですが、このRoadieを作るまではシステム開発未経験でした。前職(社内ITサポート系)を退職後に「今後に繋がる何かを勉強をしなきゃなぁ」と思い、興味があったRuby on Rails6の勉強を2021年の1月からスタートしました。現在、個人事業主の友達を被検体としてRoadieは鋭意稼働中です。せっかくなので自分が初めて作ったWebアプリRoadieの誕生から機能追加等の奮闘、Roadieが今後どうなっていくのかを日記という形で残そうかと思いこのブログを立ち上げました。既に本番環境で稼働中ですので、ローカルで開発し始めてた頃の話は記憶を掘り起こして書いていきます。Roadie爆誕2021年3月12日某所、rails newで新たな生命が誕生しました。「名前どうしようかなぁ〜…」と割と悩んだことを今でも思い出します。被検体が個人事業主をやっている友人で、その友人というのが僕と以前一緒にバンド活動をしていた仲間で、その他の関係者も音楽関係が大多数だったので「音楽関係の名前にしよう！」というのはすぐ決まりました。しかしそこからが長かったです。ホントに1時間近く悩んだかもしれないです。forutessimoやらConductorやらハ長調とか色々考えましたが、開発するアプリの役割が利用者の業務サポート(大抵そうですよね)ということを考えた瞬間名前が決まりました。そう、Roadieです。”ローディー（roadie）とは、主としてロックやフォークなどのポピュラー音楽の業界で、楽器の手配、積み込み・積み卸し、輸送（トランスポート

Webアプリを作りたいと思っても、最初の相談で何を伝えればよいか迷う方は多いです。「こんな管理画面を作りたい」「Excelでやっている業務をWeb化したい」「スマホから入力できるようにしたい」「社内で共有できる小さなツールがほしい」このようなイメージはあるものの、いざ依頼しようとすると、どこまで決めておけばいいのか分かりにくいですよね。実際には、最初から完璧な仕様書を用意する必要はありません。ただ、事前に少しだけ整理しておくと、相談がスムーズになり、見積もりの精度も上がりやすくなります。Webアプリ開発で失敗しないために大事なのは、「何を作るか」より先に、「今どんな業務で困っているか」を明確にすることです。たとえば、今の業務でこのような悩みはありませんか？Excelファイルが増えて管理しづらい。複数人で同じ情報を見たい。スマホから入力したい。検索や履歴確認をしやすくしたい。入力ミスや確認漏れを減らしたい。毎月の集計や転記作業を減らしたい。こうした悩みが整理されていると、開発する側も「Excelのまま改善した方がいいのか」「スプレッドシート連携がよいのか」「Webアプリ化した方がよいのか」を判断しやすくなります。まず整理しておきたいのは、「今の作業の流れ」です。どのタイミングで、誰が、何を入力して、誰が確認しているのか。その後、どのように集計・出力・共有しているのか。この流れが分かるだけで、必要な画面や機能がかなり見えやすくなります。たとえば、日報管理ツールであれば、現場スタッフがスマホから日報を入力する。管理者が一覧で確認する。必要に応じてコメントや承認をする。月ごとにCSVで

メタロジカル株式会社の関です。今回はユーザーに喜ばれるUIについて記事を書いていきます。弊社の強みとして、UI/UXにこだわりユーザーにとって使いやすいアプリを開発することが挙げられます。具体的には、弊社に所属する経験豊富なUIデザイナーをすべてのプロジェクトに参加させることを基本としております。ただ、「ユーザーが使いやすいデザイン」と書いていてもイメージしにくいと思いますので、この記事では具体的な⚪︎×や、クイズを交えて紹介していきます。①情報がない場合これは、お気に入り画面等でよく見られます。Bad画面ではユーザーはお気に入り画面を見た時に、情報が何もないため次のアクションができません。しかし、何も情報がないことをデザインを用いて示し、次のアクションを示す(Add Nowボタンを配置)することで次のアクションがわかります。細かい部分ですが、「ユーザーの使いやすさ」のほか、ユーザーの「アプリ滞在時間」を増やすことができ、ファン化がしやすいです。②郵便局の自動入力両方とも、「Step」が表示されていて「あとどのくらい入力すれば良いか」が明確な点は良いです。しかし、私も時々遭遇する時があり、皆さまも一回は遭遇したことがあると思うのですがBad側は郵便番号の自動入力がありません。これだけで、3つ書くことが増えてしまいます。実は自動入力でなく、ユーザーが任意でボタンを押すべきケースもあります。③クイズぜひ、この画像のどこを改善すべきか考えてください。答えは、「通知をONにするメリットが提示されていない」です。ではどうすれば良いのかというと通知は、運営からの営業通知などユーザーにメリッ

こんにちは！今回は、実践的なWebアプリケーションとして学べる「求人管理システム」の構成や機能についてご紹介します。このシステムを作ることで、社内SEを目指す方やWebエンジニアを志望する方にとって、転職活動やスキルアップの大きな助けになります！この求人管理システムでできること「求人管理システム」は、以下のような機能を持ったシンプルかつ実用的なWebアプリケーションです。求人情報の一覧表示メイン画面には、タイトル・企業名・勤務地・給与が一覧表示されるシンプルなテーブルが表示されます。求人の検索機能上部の検索バーで「フロントエンド」「営業」などのキーワードを入力することで、関連する求人情報を瞬時にフィルタリングできます。応募フォーム機能求人ごとに設置された「応募ボタン」をクリックすると、ポップアップでフォームが表示され、名前やメールアドレスを入力して応募が可能です。管理者用ページ管理者専用のモーダル画面では、新しい求人の追加、既存の求人情報の編集、不要な求人の削除が行えます。サイトの構成HTMLファイルの概要ページ全体の骨組みを構築する部分です。求人一覧テーブル、検索バー、応募フォーム、管理者用モーダルが含まれます。主な構成:<header>  <h1>求人管理システム</h1>  <input type="text" id="searchInput" placeholder="求人を検索"></header><main>  <table id="jobTable">    <!-- 求人一

PCやiphoneやAndroidに搭載されているsafariやchromeなどのWebブラウザが搭載されている機器からインターネットを経由して利用できるサービスやシステム全般のこと。インターネット環境さえあれば、どこからでもサービスを利用できます。自社課題の解決にWebシステムを導入すべきかどうか判断するためにも、Webシステムについて少しでも理解しておくことは大事です。本記事ではWebシステムの導入を検討している企業や個人事業主向けに、Webシステムについてを紹介していきます。Webシステムの仕組みWebシステムはサービス要求をする「クライアント」、そのクライアントの要求に応じる「サーバ」から成り立っています。【クライアント】Webシステムを使用するユーザーのことです。更にいうとユーザーのPCやスマートフォンの事をいいます。【サーバー】クライアントからの要求に応じてサービスを提供する側です。物理的なPCだったり仮想的な物もあります。ここにデータなどを保持する事で、クライアントはインターネット接続ができる環境であれば、端末や場所を選ぶことなくサービスが利用できます。一般的に、ここにWebシステムのプログラムを納品します。Webシステムの種類Webシステムはとても広い概念です。代表的なWebシステムには以下のようなものがあります。・SaaS型業務システム・マッチングサイト・ECサイト(BtoC,BtoB)【SaaS型業務システム】サービスにログインして利用するWebシステム。代表的なのは、経費管理、勤怠管理、CRM(顧客管理)、受発注などが上げられます。業務システムを導入する事

こんにちは、成田です。  「Webアプリを作りたいけど、プログラミングは難しい…」  そんな方に人気なのが、ノーコードツール「Bubble」です。Bubbleを使えば、コードを書かずに本格的なWebアプリを作成できます。  ただし、自由度が高い反面「思った通りに動かない」という失敗も起こりがちです。今回は、BubbleでWebアプリ開発を成功させるための3つのステップをご紹介します。ステップ①：アプリの「目的」と「ゴール」を明確にするまず大切なのは、「何を作りたいのか」を言語化することです。  たとえば：- 顧客情報を登録・検索できるシステムが欲しい  - 社内で日報を入力＆一覧表示できるツールを作りたい  - マッチングアプリのような構成にしたいこの段階で画面の流れやデータ構造を簡単に図にしてみると、後工程がスムーズになります。ステップ②：UIだけでなく「データベース設計」がカギBubbleは直感的なUI設計が強みですが、裏側の「データベース設計」こそ成功の鍵です。たとえば、  - 顧客ごとにメモやファイルを添付したい  - 管理者とユーザーで表示内容を変えたい  - 条件によって表示するボタンを変えたいこういった要件は、最初のデータ構造の作り方次第でラクにも苦労にもなります。  後から変更が大変なので、設計段階でしっかり作り込みましょう。ステップ③：プロトタイプ→改善の流れを前提に進めるBubbleは「完璧に作ってから公開」ではなく、「まず使ってもらって改善」するツールです。最初は最小構成（MVP）で作り、  → 実際のフィードバックを得て  → 改善と追加を繰り返すという

こんにちは！今回は、Reactを使用して「家計簿アプリ」を作る方法を紹介します。このアプリでは、月ごとの収支を簡単に管理でき、ユーザーが自由にカテゴリーを追加できる柔軟性があります。また、視覚的に収支のバランスが分かりやすいグラフを表示することができます。目次収支の設定自由にカテゴリー名を追加視覚的なグラフ表示ダークモードとモーダルの導入1. 収支の設定アプリを使用する際、最初に表示される収支は「250,000円」と固定されていますが、この金額はユーザーが変更できるように設計されています。収支額は動的に更新可能なので、自分の状況に合わせてカスタマイズできます。2. 自由にカテゴリー名を追加ユーザーは支出のカテゴリー名を自由に追加できます。これにより、「食費」「交通費」など、自分に合ったカテゴリーを設定でき、より個別の支出管理がしやすくなります。3. 視覚的なグラフ表示Chart.jsライブラリを使って、収入と支出を円グラフや棒グラフで視覚的に表示します。これにより、数値だけでなく、グラフを見ればすぐに収支の状況がわかります。4. ダークモードとモーダルの導入さらに、アプリのテーマをダークモードに切り替えられる機能を追加しました。夜間でも目に優しいデザインに変わり、使用者の快適さを考慮しています。また、モーダルウィンドウを使って、詳細情報を簡単に確認できるようにしています。使用技術React（フロントエンドライブラリ）Chart.js（グラフ描画ライブラリ）CSS Flexbox（レイアウト調整）このアプリの作成過程を通じて、Reactの基本的な使い方や、動的なUIの作成方法を学

今日は、Google Apps Script（GAS）を使ってシフト管理ができるウェブアプリケーションを開発しました。実際に動作するアプリを2つのバージョンで公開したので、その開発過程と成果を共有したいと思います。開発したアプリについて 完成版アプリ まず、メインとなる完成版のシフト管理システムはこちらです： [Staff Management System]（リンクは後ほど公開予定）こちらは機能性とユーザビリティを重視した本格的なバージョンになっています。なぜGASを選んだのか Google Apps Scriptを選択した理由は以下の通りです： - 無料で利用可能: Googleアカウントがあれば誰でも使える - 簡単デプロイ: 複雑な設定なしでウェブアプリとして公開できる - Google連携: スプレッドシートやGmailなどとの連携が簡単 - サーバー管理不要: Googleのインフラを使えるため運用が楽  開発で工夫したポイント 2つのアプローチ 1. **本格版（Netlify版）**: モダンなUIと豊富な機能を実装 2. **シンプル版（GAS版）**: 必要最小限の機能でお手軽に利用可能 この2つのバージョンを作ることで、様々なニーズに対応できるようにしました。 シフト管理という実際のビジネスシーンで使われることを想定し、以下の点を重視しました： - 直感的な操作性 - レスポンシブデザイン（スマホ・タブレット対応） - データの永続化 - 複数ユーザーでの利用を想定  技術的な学び GASの可能性 今回の開発を通じて、GASの持つ可能性を再認識しました。簡

こんにちは！不定期コラムまったりシステム開発　見積もり編です！前回は仕様の決定について簡単に説明しました。今回はシステム開発の見積もりと契約について説明していきます。見積もりに必要な情報見積もりには、下記の情報が必須になります。・どのようなソフトをつくるか・ソフトの機能や仕様・セキリュティ強度・使用するデータベースや外部ツール・規模などの詳細な情報見積もり前に上記のような仕様を決めてから見積もりに入ります。相談から見積もり提示までにかかる期間先に仕様を決定する必要があるため、通常3日程度お時間をいただきます。小規模なアプリで3日程度、大規模なアプリで1カ月程度かかる可能性がございます。見積の平均価格について実際の開発や作業からみた見積もり結果の平均です。下記の金額はかぴそふと内のものであり、業界全体の相場ではありませんまた、2020年6月17日時点のもので、期間が立っている場合変動している可能性がございます。ご注意ください【スクレイピング系ソフト】・AmazonやYahoo等有名サイトの商品検索　1万～2万円・WEB上からデータを取得しデータを蓄積するソフト　1万～2万円【画像編集系ソフト】・すべての画像に著作権表記を挿入するものなど　8000～12000円程度・テキストを読み込みその指示通りに出力するもの　15000～2万円程度【外部ツール操作】・Excelに出力する機能を追加　2000～5000円・自動でメール送信　2000～5000円【暗号化機能】・共通鍵暗号　2000～5000円・公開鍵暗号　5000～1万円【Android向けアプリ】・パソコンソフトとは違い割高となり

こんにちは！不定期コラムまったりシステム開発　仕様決定編です！前回はどんな開発をおこなっているかを簡単に説明しましたが、今回は開発前のやりとりを中心に解説していきます。要求事項の整理まず、お客様から〇〇システムを開発してほしいという依頼がきます。ＷＥＢのデータを収集するソフトの依頼の場合・データを収集するＷＥＢサイトのＵＲＬ・どのようなデータを収集するのか・収集したデータをソフトに保存するのか・表示形式の選択（一覧表示・1部表示など）・公開範囲（個人利用・商用利用など）上記のような細かい仕様や利用目的をつめていきます。案件によっては暗号化なども必要ですのでこの段階でどのデータを暗号化するか決めていきます。ある程度イメージができましたら、場合によってはサンプルを作らせていただきます。このサンプルは開発段階のものですので、正式版とは大きく異なる可能性があることをご理解お願いいたします。仕様の決定に必要な情報仕様の決定に必要な情報は下記のとおりです。下記の項目の記述が多ければ多いほど決定がスムーズになります。不明やない場合などは無理に考えなくても大丈夫です。また、大規模になるほど仕様の決定にお時間をいただきます。【開発概要情報】・規模（個人利用・社内利用・グループ利用・不特定多数利用など）・プラットフォーム（Windows WEB Unity Xamarin Linux Androidなど）・開発言語（指定がある場合　ない場合はこちらで選定）・開発予算（見積もり時に調整しやすくなります）・納期（はやめ・6月末までに・2週間後までに・特になしなど）※納期については短い場合お受けできない