サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
ドラクエ3
blog.codecamp.jp
フロントエンド開発をおこなっていると、 「まだバックエンドができていないけれども単体テストをおこないたい」 というケースがしばしばあります。 そんなときに便利なのがnode.jsのライブラリである 『JSON Server』 です。 今回はJSON Serverの使い方を解説していきます。 "CodeCampus"はオンラインプログラミングスクール No.1のCodeCampが運営するプログラミング未経験の方のための学習メディアです CodeCampとは?(受講生体験記) 「エンジニアは女性のキャリアとして魅力的」未経験からの転職体験記リモートワーク×多拠点居住の新しい生き方を実現する。元バレエダンサーの挑戦普通の文系大学生/営業職が、エンジニアへ転職し起業するまで成長の記録 JSON Serverとは? JSON Serverとは、APIのモックを手軽に作成できるnode.jsのライブラ
更新日: 2020年7月10日公開日: 2020年1月19日[YouTube Analytics API&Python]YouTubeの統計データを自由に操ろう 先日ご紹介させていただいた 「YouTubeレポートBot」。 こちらで使用した "YouTube Analytics API" の使い方についてご紹介させて頂きます。 YouTubeのデータ分析等を考えておられる方にとって参考になると思いますよ。 YouTube Analytics API&PythonでYouTubeの統計データを自由に操ろうYouTube Analytics APIを使うメリット 自分が管理している動画、チャンネルの統計データを公開できる 動画やチャンネルの統計データのチェックが自動化できる 頑張ればデータ分析&ラーニングさせて、予測値を得られる 一般的に YouTube で公開した動画の "視聴数" や "
更新日: 2020年11月18日公開日: 2020年11月11日現役Webデザイナーが選ぶ!デザイン修正指示ツール5選 Webサイトの制作はチーム内やクライアントとコミュニケーションをとりながら進めていきますが、デザイン修正依頼のやり取りをする機会もかなり多いですよね。 「デザイン修正依頼ってもっと効率的にできないかなあ…。」 なんて悩みを抱えていませんか? 修正指示の資料作りに何時間もかかる クライアントから届いた手書きの修正依頼が読みとれなくて、結局電話で確認 修正指示がきちんと伝わらず、同じやり取りを繰り返してしまう こんなことでデザインの修正回数が増えたり、スケジュールが遅れたりするのは防ぎたいですよね。 フリーランスのWebデザイナーとして働いている私も、何度となく繰り返される修正のやり取りで時間ばかりとられて、頭を抱える時期がありました。 そこで、この記事ではデザイン修正指示の
Gitと聞くと、Webデザイナーには難しそうだし自分には関係ないかな…と感じてしまう人も多いのではないでしょうか。 Webデザイナー歴10年のわたしも、数年前まではそう思っていました。 ところが! 実はWebデザイナーがたずさわるコーディングデータのHTMLやCSSのコード・画像・テキストなどのバックアップとして手軽に使う方法があるんです! 実際にわたしも、Gitを使いはじめてからデータ管理がとても楽になりました。 この記事では、WebデザイナーがGitを使うメリットや、使い方の入門編として初歩的な知識についてご紹介します。 Gitは難しいと決めつけずに、ぜひ参考にしてみてください! "CodeCampus"はオンラインプログラミングスクール No.1のCodeCampが運営するプログラミング未経験の方のための学習メディアです CodeCampとは?(受講生体験記) 「エンジニアは女性のキ
更新日: 2020年9月23日公開日: 2020年9月17日【CSS】hoverで作る簡単アニメーションとおすすめプロパティ6選 この記事では、簡単なアニメーションを作れるhoverについて解説しています。 「ログインボタンが透けるのってどう書いてるの?」 「カーソルを合わせるだけで動きだすようにしたい」 「CSSでいろいろ試してみたい」 動きのあるおもしろい効果をCSSで手軽に作れたら便利ですよね。 そう思っている方のために、今回は以下の3つをご紹介します。 hoverの特徴と使い方 hoverとセットで使えるプロパティ6選 hoverを使ったCSSアニメーション2選 また、記事で紹介しているコードはコピー可能です。 難しいところはコピペして、まずは感覚的に遊んでみてください!
更新日: 2022年5月31日公開日: 2020年9月23日【初心者必見】Bootstrapのテンプレートの使い方を解説 コーディングの時間を短縮したい Bootstrapという言葉を知っているけど、使うのは難しそう プログラミング初心者のなかには、このように感じている方も多いのではないでしょうか? そこで今回はBootstrapのテンプレートを使ったコーディングの時短術について解説していきます。 テンプレートを使えば、1からコーディングをするよりも圧倒的に早くWebサイトを制作できるので非常に便利です。これからBootstrapの使い方に慣れたい方やポートフォリを作ってみたいと感じている方にオススメの記事なのでぜひ参考にしてみてください。 Bootstrapとは? 実際にBootstrapのテンプレートを使う前に、Bootstrapとは何かについて簡単に説明していきます。Bootstra
更新日: 2021年3月10日公開日: 2020年9月1日【2021年版まとめ】Webデザイン・LPデザイン制作の参考サイト デザイナーにとって、日頃からたくさんのデザインを見て自分のデザインの引き出しを増やすことはとても大切です。 また、Webデザインを勉強するとき・デザインを制作するときにも、インスピレーションを求めて参考サイトを探している方も多いかと思います。 今回は、フリーランスのWebデザイナーとして活動しているわたしが日頃チェックしているギャラリーサイトをご紹介します。 更新頻度が高く、最新のデザインが追加されているサイトのみ選びました! ぜひ、ご自身のデザインにインスピレーションと学びをプラスしてください。 目次 Webデザインギャラリーサイト8選 LPデザインギャラリーサイト2選 バナーデザインギャラリーサイト2選 最後に Webデザインギャラリーサイト8選1.スマホファー
更新日: 2020年7月10日公開日: 2020年7月7日教科書には載っていないWordPressテクニック(開発環境・レンタルサーバー編) WordPressのプログラムやプラグインのCSSをチョット変更しようと思っても、その操作感ってチョット面倒くさいですよね。 レンタルサーバーからファイルをダウンロードして、編集して、アップロードするのも更新が重なると煩雑だし、かといってレンタルサーバー上のエディタは使いにくい。 そんな時は、レンタルサーバーと自分のパソコンをFTP接続しちゃえばタイムリーにWordPressを編集できるようになります。 今回はテキストエディタ一番人気のVisual Studio Codeを使って、レンタルサーバーと自分のパソコンを接続し、プログラムを編集する方法をご紹介していきたいと思います。 教科書には載っていないWordPressの楽ちん開発環境(レンタルサーバ
Python 3大フレームワークの1つ "Bottle"。 今回は、 Bottle の基本情報を抑えて、簡単な Webアプリケーションを作ってみたいと思います。 本稿は、 Python の基礎を習得済みの方を対象としています。予め、ご了承ください。 "CodeCampus"はオンラインプログラミングスクール No.1のCodeCampが運営するプログラミング未経験の方のための学習メディアです CodeCampとは?(受講生体験記) 「エンジニアは女性のキャリアとして魅力的」未経験からの転職体験記リモートワーク×多拠点居住の新しい生き方を実現する。元バレエダンサーの挑戦普通の文系大学生/営業職が、エンジニアへ転職し起業するまで成長の記録 Python初心者向け_Bottleの使い方Bottleとは http://bottlepy.org/docs/dev/ "Bottleボトル" は、Pyt
現在 Django で Webサービスを作っても、公開するまでのデプロイが大変です。 Docker や Kubernetes などのコンテナサービスがあるもののローカルPCに利用環境が無かったり、 VPS側で Django のテンプレートがあるものの 旧バージョンだったり OS が指定されたり... そこで今回は VPS の設定から Django の設定、 NGINXサーバー、 Postgres、 ドメイン、 SSLと、Webサービスを公開するまでに最低限必要な要素を一挙にご紹介します! もう Python で Webサービスを開発しないわけには、いきませんね。 "CodeCampus"はオンラインプログラミングスクール No.1のCodeCampが運営するプログラミング未経験の方のための学習メディアです CodeCampとは?(受講生体験記) 「エンジニアは女性のキャリアとして魅力的」未
2020年新しく生まれ変わった iPhone SE の Web ページでも採用されている CSS の sticky。 iPhone SE 2020 の商品ページ(LINK) 今回は実際にいくつかの sticky のサンプル・プログラムを交えて、 sticky 体験を行っていきたいと思います。 "CodeCampus"はオンラインプログラミングスクール No.1のCodeCampが運営するプログラミング未経験の方のための学習メディアです CodeCampとは?(受講生体験記) 「エンジニアは女性のキャリアとして魅力的」未経験からの転職体験記リモートワーク×多拠点居住の新しい生き方を実現する。元バレエダンサーの挑戦普通の文系大学生/営業職が、エンジニアへ転職し起業するまで成長の記録 Webデザイン志望の方必見!CSSの「sticky」を使いこなそうstickyとは sticky は CSS p
https://developers.google.com/search/docs/data-types/article 現在は約 30種類の構造化データですが、今後増える可能性もあります。Google や Yahoo!、Microsoft などによって結成された schema.org という団体がこうした構造化を企画しました。 項目の中には ビジュアル的な Webデザインと関係の無いものもありますが、一通り目を通しておきたいですね。 SEOとWebデザインとAMP AMP というと”シンプル”な印象を受けますが、 AMP の公式サイトは動きもあってかっこいいです Google は、モバイルファーストを意識し、2016年頃から Web ページにおいて AMPAccelerated Mobile Pages を推奨。 ページの読み込みスピードを重視する SEO にとって、AMP は重要なファ
更新日: 2020年7月10日公開日: 2020年5月17日【プログラミング初心者でも大丈夫】Yahoo APIを使ってみよう API は"アプリケーション・プログラミング・インターフェース”の略で、アプリケーションをプログラミングする際に、他のWebサービスのデータを自分のアプリで活用するための窓口です。 少し専門的で難しそうなイメージを持たれるかもしれませんが、プログラミング初心者が簡単に扱えるモノもあります。 例えば Yahoo!Japan の APIは、天気情報や地図情報、 Yahoo!ショッピングに関する情報、チャットボットなど、Yahoo!Japan の様々なデータを無料で活用できます。 今回は実際に API のデータ活用事例をご紹介します。 【プログラミング初心者でも大丈夫】Yahoo APIを使ってみようYahoo!JapanのAPI活用事例 まずは Yahoo の API
更新日: 2020年7月10日公開日: 2020年5月11日[テンプレ付き]WordPress×Stripeでネットビジネスを始めよう 個人でも気軽に Web 上で課金機能を搭載できる 「Stripe」。 今回は WordPress に Stripe 対応のプラグインを使って、基本的な課金機能を利用する例をご紹介します。 [テンプレ付き]WordPress×Stripeでネットビジネスを始めようStripeとは stripe.comn Stripeは、アメリカを拠点に世界36カ国に決済サービスを展開する企業で、従業員数 2,000名以上、企業価値 3兆 5,000億円以上の非上場企業。 Stripe を利用すれば個人・法人問わず Web上でクレジットカード決済機能を利用でき、Webビジネスを加速させてくれます。実施に私も使っていますが、入金もスムーズで、見やすい管理画面が ◎ です。 そん
CSS、参考書や講座で登場してくるセレクタやプロパティ以外にも、たくさん便利そうなモノがあるってご存知でしょうか? 今回は特に最近各種ブラウザーが対応はじめたセレクタやプロパティをご紹介させて頂きます。 「おっ、それやったら JavaScript を組まなくても良さそうやな」というところもあると思いますので、参考にしてみてください。 【ご紹介するセレクタ】 scroll-snap sticky filter prefers-color-scheme grid "CodeCampus"はオンラインプログラミングスクール No.1のCodeCampが運営するプログラミング未経験の方のための学習メディアです CodeCampとは?(受講生体験記) 「エンジニアは女性のキャリアとして魅力的」未経験からの転職体験記リモートワーク×多拠点居住の新しい生き方を実現する。元バレエダンサーの挑戦普通の文系大
なにかと "Web" には興味あるものの、サーバー代やドメイン代、慣れない操作感等でモヤモヤされている方も多いのではないでしょうか? 今回は "常時接続" "広告無し" でサーバーを無料利用できる 「Pythonanywhere」 についてご紹介。 機械学習のプログラムを実行したことあるけど、そこから前に進んでいない方、チョット前進できるかもしれませんよ。 "CodeCampus"はオンラインプログラミングスクール No.1のCodeCampが運営するプログラミング未経験の方のための学習メディアです CodeCampとは?(受講生体験記) 「エンジニアは女性のキャリアとして魅力的」未経験からの転職体験記リモートワーク×多拠点居住の新しい生き方を実現する。元バレエダンサーの挑戦普通の文系大学生/営業職が、エンジニアへ転職し起業するまで成長の記録 ★flask_app.py★ from fla
phpでは現在アクセスされているページのURLを取得することができます。また、その方法はいくつか用意されており、今回はその方法をサンプルソースを交え、わかりやすく解説していきます。 "CodeCampus"はオンラインプログラミングスクール No.1のCodeCampが運営するプログラミング未経験の方のための学習メディアです CodeCampとは?(受講生体験記) 「エンジニアは女性のキャリアとして魅力的」未経験からの転職体験記リモートワーク×多拠点居住の新しい生き方を実現する。元バレエダンサーの挑戦普通の文系大学生/営業職が、エンジニアへ転職し起業するまで成長の記録 phpで現在のURLを取得する 現在のURL(自分のurl)を取得するにはスーパーグローバル変数にアクセスする必要があり、基本的には $_SERVER というスーパーグローバル変数にアクセスすることで値を取得することができま
更新日: 2020年7月10日公開日: 2020年1月27日【Python入門】プログラミングで自分だけの株価データを手に入れよう 株式投資、いつの時代も根強い人気がありますよね、私も好きです。 そして気になる銘柄のデータを分析しようとパソコンやスマホを開いたら、概ねチャートしか出てこないと思います。これではエクセルなどでデータとして株価を扱えないために、データ分析ができません。ところが、プログラミングを使えば無料で株価データを取得できます。 今回は 「API」 と 「Webスクレイピング」 2つ の方法を用いて、 日経225 にリストアップされている会社の株価を Python で取得してみました。 株に興味ある、プログラミング(Python)にも興味あるという方、ご参考ください。 【Python入門】プログラミングで自分だけの株価データを手に入れようプログラミングを使わずに株価データを取
3言語の概要、ニーズ、情報量等をまとめた表です 上記表の Googleシート(止まってます) さて Androidアプリ開発では Dart 優勢に感じる状況ですが、上記表の様に総合的に判断した場合も、 Dart優勢でしょうか?上記表は実際に Java、 Kotlin、 Dart(Flutter) の 3つの言語それぞれを使って、Android アプリ開発をし、その上で情報収集してみた結果になります。 本稿はプログラミングをはじめようかな、はじめたばかり、という方を対象にしているつもりですが、どの言語でも学習初期の作業パターンってある程度決まっていると思います。 開発環境の作成 参考書の購入 簡単なプログラムやサンプルアプリを作ってみる サンプルアプリをいろいろ試してみる サンプルを元にいろいろ応用してみる このルーティーンが上手く回れば、「プログラミング、楽しい」「アプリ開発、楽しい」「儲
今回はとりあえず実機でカメラが動き、撮影画像の保存、そして再度カメラ撮影、というようなカメラの最低限の機能を備えたアプリを作ってみました。 【上記の XCodeデータ】 cameraiOS カメラアプリの作成手順Step.1 新規プロジェクトの作成 XCode起動後、新規プロジェクトの作成、 「Single View App」 を選択し、プロジェクト名を決定しましょう。 プロジェクト作成後、一旦プロジェクトのビルド環境を確認。最初の画面の上部で現在 「General」 が選択されていると思いますが、それを 4つ横の 「Build Settings」 をクリック(上図参照)。 こちらはプログラムやシミュレーターの起動設定を行うところで、この欄の下の方の 「Swift Compiler - Language」 が Swift 4.2 になっていることを確認しておきましょう。 【最初に Swif
【snippetとは】 現在作業している YouTube API List のページを見ていると、 part 部分は snippet を入力してくださいと書かれています(上図参照)。 snippet、気になりますよね。 snippet はプログラミング言語の一種で、この場合では API アクセスによってサーバーから返ってくるデータを適切に処理するために必要な項目。 Google 検索の検索結果表示でも snippet が使われていますね(下図参照)。 channelID 以外にも詳細検索の項目がたくさんありますが、とりあえず一番下までスクロールして EXECUTE。すると Google のアカウント確認があって、そのあと以下のようなデータが出力されます。 これは私の YouTubeチャンネルに関する情報で、 JSON形式でデータが返ってきていることが確認できます。少々見にくいので、内容を確
「個人 × Web」 ベースでサブ収入と考えると、ブログやアフィリエイト、 YouTuber などを思いつく方が多いと思います。 Webアプリ、という選択肢はどうでしょうか? Ruby on Rails などを使ったり、 API を使ったりやや本格的なプログラム処理が伴う "Webアプリ"。 個人でも Webアプリを作成し、サブ収入化、起業に成功している方がいらっしゃいますのでご紹介させて頂きます。プログラミングのモチベーションアップにつながれば幸いです。 << 今回ご紹介する成功者の方々 >> renさん(起業に成功) 入江さん(起業に成功) TAKUYAさん(起業に成功) ジャバ・ザ・ハットリさん(サブ収入に成功) dala00さん(個人開発に成功) 染谷佳佑さん(バズに成功) グリー株式会社(起業に成功) 価格.com(事業売却に成功) 2チャンネル(起業&事業売却に成功) 赤星琢哉
Docker の学習初期に多くの方が疑問に思う「イメージとコンテナの違い」。 Googleで「docker image container difference」 と検索すると、” image VS container ” 等どっちを使うべきみたいな記事も。混乱しますよね。 今回は、プログラミング初心者、サーバー開発初心者の方でも分かりやすいように情報をまとめてみました。 "CodeCampus"はオンラインプログラミングスクール No.1のCodeCampが運営するプログラミング未経験の方のための学習メディアです CodeCampとは?(受講生体験記) 「エンジニアは女性のキャリアとして魅力的」未経験からの転職体験記リモートワーク×多拠点居住の新しい生き方を実現する。元バレエダンサーの挑戦普通の文系大学生/営業職が、エンジニアへ転職し起業するまで成長の記録 Dockerのイメージとコンテ
AWSで Dockerコンテナを運用しようとしたり、 DockerでRailsを起動しようとした時に Dockerfile は必要。 こちらでは Dokcerfile の基本的な書き方や起動方法、確認方法をご紹介させて頂きます。 "CodeCampus"はオンラインプログラミングスクール No.1のCodeCampが運営するプログラミング未経験の方のための学習メディアです CodeCampとは?(受講生体験記) 「エンジニアは女性のキャリアとして魅力的」未経験からの転職体験記リモートワーク×多拠点居住の新しい生き方を実現する。元バレエダンサーの挑戦普通の文系大学生/営業職が、エンジニアへ転職し起業するまで成長の記録 Dockerfileの書き方と使い方と確認方法Dockerfileとは 画像クリックで拡大 Dockerfileは、Dockerのイメージを自動で作成してくれるファイル。 do
更新日: 2017年3月21日公開日: 2016年10月27日新人Webディレクター必見!要件定義とは Web ディレクターにとって必須工程となる要件定義。 なんだか面倒くさそう、難しそう、と思って後回しにされていませんか? 自己防衛の意味でも 要件定義 は重要なファクターとなりますので、頑張って基礎知識だけでも習得しておきましょう! 新人Webディレクター必見!要件定義とは要件定義とは img:IPA 要件定義とは、Web サイトやアプリケーションなどの開発初期段階において、発注者と受注者の情報共有のために、実装すべき機能や満たずべき性能を第3者でも分かるように明確化しておく作業のことです。 要件定義は、Web サイトやアプリ開発において非常に重要な役割を担っていて、要件定義のでき次第で開発の成功が左右されるとも言われています。 一般的に要件定義の主導権は受注側(開発側)のディレクターが
更新日: 2017年3月23日公開日: 2015年12月2日idとclassをわかりやすく説明!ゼロから始めるHTML/CSS講座Vol13 "CodeCampus"はオンラインプログラミングスクール No.1のCodeCampが運営するプログラミング未経験の方のための学習メディアです CodeCampとは?(受講生体験記) 「エンジニアは女性のキャリアとして魅力的」未経験からの転職体験記リモートワーク×多拠点居住の新しい生き方を実現する。元バレエダンサーの挑戦普通の文系大学生/営業職が、エンジニアへ転職し起業するまで成長の記録 ゼロから始めるHTML/CSS講座idとclassid属性とclass属性 これまでCSSのセレクタは要素(h1、pなど)を指定していましたが、p要素のように多用される要素の場合、同じ要素でも別なCSSを適用したい場合があります。そのような場合、HTMLのid属性
date()関数の引数では上記の記号を組み合わせることで、任意のフォーマットで時刻を取得することができます。 日付取得(今日) echo date("Y/m/d"); 結果 "2017/08/21" 現在日時 echo date("Y/m/d H:i:s"); 結果 "2017/08/21 03:50:38" 現在時刻 + 今日の曜日 echo date("Y/m/d - M (D) H:i:s"); 結果 "2017/08/21 - Aug (Mon) 03:50:38" となります。 日付がずれる場合 これまでの時刻の出力結果が自身のPCの日付とずれている方もいらっしゃるかと思います。 php.iniの設定ファイルの場所を確認する方法!【mac/linux】 を御覧いただき、php.iniを編集することで、デフォルトのタイムゾーンを指定することができます。 php.iniをいじるはちょ
更新日: 2019年06月27日公開日: 2019年06月26日Dockerを使ってWordPressの環境を構築する方法 Docker、なんだか便利そうだけど公式サイトや参考書を読んでもわかる・・・ようなわからない・・・・・ような、という方も多いのでは。また実際に Docker をチュートリアル通りに実行しても、エラーで上手くいかず疲れている方もいらっしゃるのではないでしょうか? こちらではプログラミング初心者、サーバーサイド開発初心者を対象として、 Docker を噛み砕いてご紹介。なるべく専門用語は避けて、 Docker をイメージできるようにまとめてみました。 【記事内の実行環境】 OS: Ubuntu 16.04 デスクトップ(Linux系) Docker: Version 18.09.6 Docker Compose: Version 1.22.0 尚、記事内の Docker
最近Webページ作成やブログ開設などのWebサイト作成でよく使われているWordPress。そのWordPressでサイトを作成するときに欠かせないのがテーマです。テーマとは簡単に言うとサイトのデザインの着せ替えのような機能で、テーマを使えば簡単に見る人を引き付ける魅力的なサイトを作ることができます。 同じ文章や画像でもテーマを変えることでその印象はかなり違ってきます。現在では様々なテーマがあり自分の好みに合ったテーマを選択することができます。しかし、数が多すぎるためどんなテーマを選んでよいかわからない、有料と無料があって迷うなど戸惑うところもあります。 そこで今回は無料のWordPressテーマに焦点をあて、有料テーマとの違いやオススメの無料テーマなどをご紹介します! "CodeCampus"はオンラインプログラミングスクール No.1のCodeCampが運営するプログラミング未経験の方
次のページ
このページを最初にブックマークしてみませんか?
『CodeCampus テクノロジーの「学ぶ・働く」を知るメディア』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く