ダウンロードしてきたテンプレートを使いこなせない。
解決したいこと
ネットからWEBのトップページに関するファイルをダウンロードしました。
そのディレクトリをそれぞれどのディレクトリに配置すれば正しく表示されるのかわからない状態です。
エラーメッセージ(検証ツールで確認)
isotope.js:141 Uncaught Error: Cannot find module 'jquery'
at webpackMissingModule (isotope.js:141)
at isotope.js:141
at Object../app/javascript/isotope.js (isotope.js:149)
at __webpack_require__ (bootstrap:19)
at Object../app/javascript/packs/application.js (application.js:10)
at __webpack_require__ (bootstrap:19)
at bootstrap:83
at bootstrap:83
上記エラー以外に関しては、似たようなエラーが続いて連発表示されています。(下記)
GET http://localhost:3000/style/mystyle.css net::ERR_ABORTED 404 (Not Found)
localhost/:534
GET http://localhost:3000/source/bootstrap-3.3.6-dist/js/jquery.js net::ERR_ABORTED 404 (Not Found)localhost/:35
GET http://localhost:3000/source/font-awesome-4.5.0/css/font-awesome.css 404 (Not Found)
localhost/:34
GET http://localhost:3000/source/bootstrap-3.3.6-dist/css/bootstrap.css net::ERR_ABORTED 404 (Not Found)
localhost/:36
現状下記です。
表示させたい画面のデモ
https://www.tooplate.com/live/2079-garage
ダウンロードしたファイル
app/javascript/packs/application.js
// This file is automatically compiled by Webpack, along with any other files
// present in this directory. You're encouraged to place your actual application logic in
// a relevant structure within app/javascript and only use these pack files to reference
// that code so it'll be compiled.
require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")
require("../isotope")
require("../myscript")
require("../selectordie")
// Uncomment to copy all static images under ../images to the output folder and reference
// them with the image_pack_tag helper in views (e.g <%= image_pack_tag 'rails.png' %>)
// or the `imagePath` JavaScript helper below.
//
// const images = require.context('../images', true)
// const imagePath = (name) => images(name, true)
//= require jquery
//= require bootstrap-sprockets
app/vies/movies/index.html.erb
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Garage Bootstrap Template</title>
<meta name="description" content="">
<!--
Template 2079 Garage
http://www.tooplate.com/view/2079-garage
-->
<meta name="author" content="Web Domus Italia">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="source/bootstrap-3.3.6-dist/css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="source/font-awesome-4.5.0/css/font-awesome.css">
<link rel="stylesheet" type="text/css" href="style/slider.css">
<link rel="stylesheet" type="text/css" href="style/mystyle.css">
</head>
<body>
<!-- Header -->
<div class="allcontain">
<div class="header">
<ul class="socialicon">
<li><a href="#"><i class="fa fa-facebook"></i></a></li>
<li><a href="#"><i class="fa fa-twitter"></i></a></li>
<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
<li><a href="#"><i class="fa fa-pinterest"></i></a></li>
</ul>
<ul class="givusacall">
<li>お問い合わせはこちら : 04-7191-2321 </li>
</ul>
<ul class="logreg">
<li><a href="#">ログイン</a> </li>
<li><a href="#"><span class="register">新規登録</span></a></li>
</ul>
</div>
<!-- Navbar Up -->
<nav class="topnavbar navbar-default topnav">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed toggle-costume" data-toggle="collapse" data-target="#upmenu" aria-expanded="false">
<span class="sr-only"> Toggle navigaion</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand logo" href="#"><img src="images/image/logo1.png" alt="logo"></a>
</div>
</div>
<div class="collapse navbar-collapse" id="upmenu">
<ul class="nav navbar-nav" id="navbarontop">
<li class="active"><a href="#">HOME</a> </li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">CATEGORIES <span class="caret"></span></a>
<ul class="dropdown-menu dropdowncostume">
<li><a href="#">Sport</a></li>
<li><a href="#">Old</a></li>
<li><a href="#">New</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">DEALERS <span class="caret"></span></a>
<ul class="dropdown-menu dropdowncostume">
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="3">3</a></li>
</ul>
</li>
<li>
<a href="contact.html">CONTACT</a>
</li>
<button><span class="postnewcar">POST NEW CAR</span></button>
</ul>
</div>
</nav>
</div>
<!--_______________________________________ Carousel__________________________________ -->
<div class="allcontain">
<div id="carousel-up" class="carousel slide" data-ride="carousel">
<div class="carousel-inner " role="listbox">
<div class="item active">
<img src="image/oldcar.jpg" alt="oldcar">
<div class="carousel-caption">
<h2>Porsche 356</h2>
<p>Lorem ipsum dolor sit amet, consectetur ,<br>
sed do eiusmod tempor incididunt ut labore </p>
</div>
</div>
<div class="item">
<img src="image/porche.jpg" alt="porche">
<div class="carousel-caption">
<h2>Porche</h2>
<p>Lorem ipsum dolor sit amet, consectetur ,<br>
sed do eiusmod tempor incididunt ut labore </p>
</div>
</div>
<div class="item">
<img src="image/benz.jpg" alt="benz">
<div class="carousel-caption">
<h2>Car</h2>
<p>Lorem ipsum dolor sit amet, consectetur ,<br>
sed do eiusmod tempor incididunt ut labore </p>
</div>
</div>
</div>
<nav class="navbar navbar-default midle-nav">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed textcostume" data-toggle="collapse" data-target="#navbarmidle" aria-expanded="false">
<h1>SEARCH TEXT</h1>
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse" id="navbarmidle">
<div class="searchtxt">
<h1>SEARCH TEXT</h1>
</div>
<form class="navbar-form navbar-left searchformmargin" role="search">
<div class="form-group">
<input type="text" class="form-control searchform" placeholder="Enter Keyword">
</div>
</form>
<ul class="nav navbar-nav navbarborder">
<li class="li-category">
<a class="btn dropdown-toggle btn-costume" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">Category<span class="glyphicon glyphicon-chevron-down downicon"></span></a>
<ul class="dropdown-menu" id="mydd">
<li><a href="#">Epic</a></li>
<li><a href="#">Old</a></li>
<li><a href="#">New</a></li>
</ul>
</li>
<li class="li-minyear"><a class="btn dropdown-toggle btn-costume" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">Min Year <span class="glyphicon glyphicon-chevron-down downicon"></span></a>
<ul class="dropdown-menu" id="mydd2">
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
</ul>
</li>
<li class="li-maxyear"><a class="btn dropdown-toggle btn-costume" id="dropdownMenu3" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">Max Year <span class="glyphicon glyphicon-chevron-down downicon"></span></a>
<ul class="dropdown-menu" id="mydd3">
<li><a href="#">1900</a></li>
<li><a href="#">2000</a></li>
<li><a href="#">2016</a></li>
</ul>
</li>
<li class="li-slideprice">
<p> <label class="slidertxt" for="amount">Price </label>
<input class="priceslider" type="text" id="amount" readonly="readonly">
</p>
<div id="slider-range"></div>
</li>
<li class="li-search"> <button class="searchbutton"><span class="glyphicon glyphicon-search "></span></button></li>
</ul>
</div>
</nav>
</div>
</div>
<!-- ____________________Featured Section ______________________________-->
<div class="allcontain">
<div class="feturedsection">
<h1 class="text-center"><span class="bdots">•</span>F E A T U R E S<span class="carstxt">C A R S</span>•</h1>
</div>
<div class="feturedimage">
<div class="row firstrow">
<div class="col-lg-6 costumcol colborder1">
<div class="row costumrow">
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 img1colon">
<img src="image/featurporch.jpg" alt="porsche">
</div>
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 txt1colon ">
<div class="featurecontant">
<h1>LOREM IPSUM</h1>
<p>"Lorem ipsum dolor sit amet, consectetur ,<br>
sed do eiusmod tempor incididunt </p>
<h2>Price €</h2>
<button id="btnRM" onClick="rmtxt()">READ MORE</button>
<div id="readmore">
<h1>Car Name</h1>
<p>"Lorem ipsum dolor sit amet, consectetur ,<br>
sed do eiusmod tempor incididunt <br>"Lorem ipsum dolor sit amet, consectetur ,<br>
sed do eiusmod tempor incididunt"Lorem ipsum dolor sit amet, consectetur1 ,
sed do eiusmod tempor incididunt"Lorem ipsum dolor sit amet, consectetur1
sed do eiusmod tempor incididunt"Lorem ipsum dolor sit amet, consectetur1<br>
</p>
<button id="btnRL">READ LESS</button>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-6 costumcol colborder2">
<div class="row costumrow">
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 img2colon">
<img src="image/featurporch1.jpg" alt="porsche1">
</div>
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 txt1colon ">
<div class="featurecontant">
<h1>LOREM IPSUM</h1>
<p>"Lorem ipsum dolor sit amet, consectetur ,<br>
sed do eiusmod tempor incididunt </p>
<h2>Price €</h2>
<button id="btnRM2">READ MORE</button>
<div id="readmore2">
<h1>Car Name</h1>
<p>"Lorem ipsum dolor sit amet, consectetur ,<br>
sed do eiusmod tempor incididunt <br>"Lorem ipsum dolor sit amet, consectetur ,<br>
sed do eiusmod tempor incididunt"Lorem ipsum dolor sit amet, consectetur1 ,
sed do eiusmod tempor incididunt"Lorem ipsum dolor sit amet, consectetur1
sed do eiusmod tempor incididunt"Lorem ipsum dolor sit amet, consectetur1<br></p>
<button id="btnRL2">READ LESS</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- ________________________LATEST CARS SECTION _______________________-->
<div class="latestcars">
<h1 class="text-center">• LATEST CARS •</h1>
<ul class="nav nav-tabs navbar-left latest-navleft">
<li role="presentation" class="li-sortby"><span class="sortby">SORT BY: </span></li>
<li data-filter=".RECENT" role="presentation"><a href="#mostrecent" class="prcBtnR">MOST RECENT </a></li>
<li data-filter=".POPULAR" role="presentation"><a href="#mostpopular" class="prcBtnR">MOST POPULAR </a></li>
<li role="presentation"><a href="#" class="alphSort">ALPHABETICAL </a></li>
<li data-filter=".HPRICE" role="presentation"><a href="#" class="prcBtnH">HIGHEST PRICE </a></li>
<li data-filter=".LPRICE" role="presentation"><a href="#" class="prcBtnL">LOWEST PRICE </a></li>
<li id="hideonmobile">
</ul>
</div>
<br>
<br>
<!-- ________________________Latest Cars Image Thumbnail________________-->
<div class="grid">
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
<div class="txthover">
<img src="image/car1.jpg" alt="car1">
<div class="txtcontent">
<div class="stars">
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
</div>
<div class="simpletxt">
<h3 class="name">Rolls Royce</h3>
<p>"Lorem ipsum dolor sit amet, consectetur,<br>
sed do eiusmod tempor incididunt" </p>
<h4 class="price"> 1000€</h4>
<button>READ MORE</button><br>
<div class="wishtxt">
<p class="paragraph1"> Add to Wishlist <span class="glyphicon glyphicon-heart"></span> </p>
<p class="paragraph2">Compare <span class="icon"><img src="image/compicon.png" alt="compicon"></span></p>
</div>
</div>
<div class="stars2">
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
</div>
</div>
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3 ">
<div class="txthover">
<img src="image/car2.jpg" alt="car2">
<div class="txtcontent">
<div class="stars">
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
</div>
<div class="simpletxt">
<h3 class="name">Renault</h3>
<p>"Lorem ipsum dolor sit amet, consectetur,<br>
sed do eiusmod tempor incididunt" </p>
<h4 class="price">900 €</h4>
<button>READ MORE</button><br>
<div class="wishtxt">
<p class="paragraph1"> Add to Wishlist <span class="glyphicon glyphicon-heart"></span> </p>
<p class="paragraph2">Compare <span class="icon"><img src="image/compicon.png" alt="compicon"></span></p>
</div>
</div>
<div class="stars2">
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
</div>
</div>
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
<div class="txthover">
<img src="image/car3.jpg" alt="car3">
<div class="txtcontent">
<div class="stars">
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
</div>
<div class="simpletxt">
<h3 class="name">Ford Mustang</h3>
<p>"Lorem ipsum dolor sit amet, consectetur,<br>
sed do eiusmod tempor incididunt" </p>
<h4 class="price">3000 €</h4>
<button>READ MORE</button><br>
<div class="wishtxt">
<p class="paragraph1"> Add to Wishlist <span class="glyphicon glyphicon-heart"></span> </p>
<p class="paragraph2">Compare <span class="icon"><img src="image/compicon.png" alt="compicon"></span></p>
</div>
</div>
<div class="stars2">
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
</div>
</div>
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
<div class="txthover">
<img src="image/car4.jpg" alt="car4">
<div class="txtcontent">
<div class="stars">
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
</div>
<div class="simpletxt">
<h3 class="name">Rover</h3>
<p>"Lorem ipsum dolor sit amet, consectetur,<br>
sed do eiusmod tempor incididunt" </p>
<h4 class="price">1000 €</h4>
<button>READ MORE</button><br>
<div class="wishtxt">
<p class="paragraph1"> Add to Wishlist <span class="glyphicon glyphicon-heart"></span> </p>
<p class="paragraph2">Compare <span class="icon"><img src="image/compicon.png" alt="compicon"></span></p>
</div>
</div>
<div class="stars2">
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
</div>
</div>
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
<div class="txthover">
<img src="image/car5.jpg" alt="car5">
<div class="txtcontent">
<div class="stars">
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
</div>
<div class="simpletxt">
<h3 class="name">Porche</h3>
<p>"Lorem ipsum dolor sit amet, consectetur,<br>
sed do eiusmod tempor incididunt" </p>
<h4 class="price">1200 €</h4>
<button>READ MORE</button><br>
<div class="wishtxt">
<p class="paragraph1"> Add to Wishlist <span class="glyphicon glyphicon-heart"></span> </p>
<p class="paragraph2">Compare <span class="icon"><img src="image/compicon.png" alt="compicon"></span></p>
</div>
</div>
<div class="stars2">
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
</div>
</div>
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
<div class="txthover">
<img src="image/car6.jpg" alt="car6">
<div class="txtcontent">
<div class="stars">
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
</div>
<div class="simpletxt">
<h3 class="name">Porche 911</h3>
<p>"Lorem ipsum dolor sit amet, consectetur,<br>
sed do eiusmod tempor incididunt" </p>
<h4 class="price">4000 €</h4>
<button>READ MORE</button><br>
<div class="wishtxt">
<p class="paragraph1"> Add to Wishlist <span class="glyphicon glyphicon-heart"></span> </p>
<p class="paragraph2">Compare <span class="icon"><img src="image/compicon.png" alt="compicon"></span></p>
</div>
</div>
<div class="stars2">
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
</div>
</div>
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
<div class="txthover">
<img src="image/car7.jpg" alt="car7">
<div class="txtcontent">
<div class="stars">
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
</div>
<div class="simpletxt">
<h3 class="name">Chevrolet SS</h3>
<p>"Lorem ipsum dolor sit amet, consectetur,<br>
sed do eiusmod tempor incididunt" </p>
<h4 class="price">3000 €</h4>
<button>READ MORE</button><br>
<div class="wishtxt">
<p class="paragraph1"> Add to Wishlist <span class="glyphicon glyphicon-heart"></span> </p>
<p class="paragraph2">Compare <span class="icon"><img src="image/compicon.png" alt="compicon"></span></p>
</div>
</div>
<div class="stars2">
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
</div>
</div>
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
<div class="txthover">
<img src="image/car8.jpg" alt="car8">
<div class="txtcontent">
<div class="stars">
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
</div>
<div class="simpletxt">
<h3 class="name">Meclaren</h3>
<p>"Lorem ipsum dolor sit amet, consectetur,<br>
sed do eiusmod tempor incididunt" </p>
<h4 class="price">2500 €</h4>
<button>READ MORE</button><br>
<div class="wishtxt">
<p class="paragraph1"> Add to Wishlist <span class="glyphicon glyphicon-heart"></span> </p>
<p class="paragraph2">Compare <span class="icon"><img src="image/compicon.png" alt="compicon"></span></p>
</div>
</div>
<div class="stars2">
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
<div class="glyphicon glyphicon-star"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- _______________________________News Letter ____________________-->
<div class="newslettercontent">
<div class="leftside">
<img src="image/border.png" alt="border">
<h1>NEWSLETTER</h1>
<p>Subscribe to the COLLECTIONCARS mailing list to <br>
receive updates on new arrivals, special offers <br>
and other discount information.</p>
</div>
<div class="rightside">
<img class="newsimage" src="image/newsletter.jpg" alt="newsletter">
<input type="text" class="form-control" id="subemail" placeholder="EMAIL">
<button>SUBSCRIBE</button>
</div>
</div>
<!-- ______________________________________________________Bottom Menu ______________________________-->
<div class="bottommenu">
<div class="bottomlogo">
<span class="dotlogo">•</span><img src="image/collectionlogo1.png" alt="logo1"><span class="dotlogo">•;</span>
</div>
<ul class="nav nav-tabs bottomlinks">
<li role="presentation" ><a href="#/" role="button">ABOUT US</a></li>
<li role="presentation"><a href="#/">CATEGORIES</a></li>
<li role="presentation"><a href="#/">PREORDERS</a></li>
<li role="presentation"><a href="#/">CONTACT US</a></li>
<li role="presentation"><a href="#/">RECEIVE OUR NEWSLETTER</a></li>
</ul>
<p>"Lorem ipsum dolor sit amet, consectetur, sed do eiusmod tempor incididunt <br>
eiusmod tempor incididunt"</p>
<img src="image/line.png" alt="line"> <br>
<div class="bottomsocial">
<a href="#"><i class="fa fa-facebook"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
<a href="#"><i class="fa fa-google-plus"></i></a>
<a href="#"><i class="fa fa-pinterest"></i></a>
</div>
<div class="footer">
<div class="copyright">
© Copy right 2016 | <a href="#">Privacy </a>| <a href="#">Policy</a>
</div>
<div class="atisda">
Designed by <a href="http://www.webdomus.net/">Web Domus Italia - Web Agency </a>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="source/bootstrap-3.3.6-dist/js/jquery.js"></script>
<script type="text/javascript" src="source/js/isotope.js"></script>
<script type="text/javascript" src="source/js/myscript.js"></script>
<script type="text/javascript" src="source/bootstrap-3.3.6-dist/js/jquery.1.11.js"></script>
<script type="text/javascript" src="source/bootstrap-3.3.6-dist/js/bootstrap.js"></script>
</body>
</html>
Gemfile
source 'https://rubygems.org'
git_source(:github) { |repo| "https://github.com/#{repo}.git" }
ruby '2.6.5'
gem "sass-rails", "~>5"
gem "bootstrap-sass", "~>3.3.6"
gem "jquery-rails"
gem "jquery-ui-rails"
# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '~> 6.0.0'
# Use mysql as the database for Active Record
gem 'mysql2', '>= 0.5.3'
# Use Puma as the app server
gem 'puma', '~> 3.11'
# Use SCSS for stylesheets
gem 'sass-rails', '~> 5'
# Transpile app-like JavaScript. Read more: https://github.com/rails/webpacker
gem 'webpacker', '~> 4.0'
# Turbolinks makes navigating your web application faster. Read more: https://github.com/turbolinks/turbolinks
gem 'turbolinks', '~> 5'
# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
gem 'jbuilder', '~> 2.7'
# Use Redis adapter to run Action Cable in production
# gem 'redis', '~> 4.0'
# Use Active Model has_secure_password
# gem 'bcrypt', '~> 3.1.7'
# Use Active Storage variant
# gem 'image_processing', '~> 1.2'
# Reduces boot times through caching; required in config/boot.rb
gem 'bootsnap', '>= 1.4.2', require: false
group :development, :test do
# Call 'byebug' anywhere in the code to stop execution and get a debugger console
gem 'byebug', platforms: [:mri, :mingw, :x64_mingw]
end
group :development do
# Access an interactive console on exception pages or by calling 'console' anywhere in the code.
gem 'web-console', '>= 3.3.0'
gem 'listen', '>= 3.0.5', '< 3.2'
# Spring speeds up development by keeping your application running in the background. Read more: https://github.com/rails/spring
gem 'spring'
gem 'spring-watcher-listen', '~> 2.0.0'
end
group :test do
# Adds support for Capybara system testing and selenium driver
gem 'capybara', '>= 2.15'
gem 'selenium-webdriver'
# Easy installation and use of web drivers to run system tests with browsers
gem 'webdrivers'
end
# Windows does not include zoneinfo files, so bundle the tzinfo-data gem
gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]
gem 'pry-rails'
gem 'font-awesome-sass'
自分で試したこと
gem "sass-rails", "~>5"
gem "bootstrap-sass", "~>3.3.6"
gem "jquery-rails"
gem "jquery-ui-rails"
gem 'font-awesome-sass'
のそれぞれのインストールと、indexのsrcの部分の画像のディレクトリ指定が最初"image/logo1.png"だったので、
"images/image/logo1.png"に変更しても画像は読み込まれず、検証ツールで確認したところエラーが確認された。
ググってみたが、解決方法がわからず困っています。
どなたかわかる方いましたら、ご教授お願いしたいです。
初心者のため、確認したいディレクトリを提示できていない可能性が大きいので、言っていただければすぐに開示いたします。
0