Skip to content
GitLab
Commit 0bf288f7 authored by lena's avatar lena
Browse files

git init

parents
Branches master
No related merge requests found
Pipeline #39 failed with stages
Expand all Hide whitespace changes
Inline Side-by-side
Showing
with 416 additions and 0 deletions
react-template-site/.babelrc 0 → 100755
+ 7
− 0
View file @ 0bf288f7
{
"presets": [
"@babel/preset-env",
"@babel/preset-react"
]
}
\ No newline at end of file
react-template-site/.gitignore 0 → 100755
+ 6
− 0
View file @ 0bf288f7
# Node Modules
/node_modules
# Distribution
/dist
\ No newline at end of file
react-template-site/README.md 0 → 100755
+ 9
− 0
View file @ 0bf288f7
# Simple React Webpack boilerplate
A ready to use simple boilerplate for React Apps.
## Instructions
* Clone the repo
* Run `npm install`
* Run `npm start`
react-template-site/package-lock.json 0 → 100755
+ 0
− 0
View file @ 0bf288f7
This diff is collapsed.
react-template-site/package.json 0 → 100755
+ 36
− 0
View file @ 0bf288f7
{
"name": "react-boilerplate",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "webpack-dev-server --mode development --open --hot",
"build": "webpack --mode production"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"@babel/core": "^7.1.2",
"@babel/preset-env": "^7.1.0",
"@babel/preset-react": "^7.0.0",
"babel-loader": "^8.0.4",
"css-loader": "^1.0.1",
"html-webpack-plugin": "^3.2.0",
"less": "^3.9.0",
"less-loader": "^5.0.0",
"style-loader": "^0.23.1",
"webpack": "^4.20.2",
"webpack-cli": "^3.1.1",
"webpack-dev-server": "^3.1.14"
},
"dependencies": {
"bootstrap": "^4.3.1",
"json-loader": "^0.5.7",
"react": "^16.5.2",
"react-dom": "^16.5.2",
"react-items-carousel": "^2.3.6",
"react-leaf-carousel": "^1.2.2",
"react-slick": "^0.24.0"
}
}
react-template-site/src/components/App.js 0 → 100755
+ 31
− 0
View file @ 0bf288f7
import React, { Component } from "react";
import '../styles/App.css';
import Header from "./Header";
import Featured_Content from './Featured_Content';
import Content from './Content';
import Content_List from "./Content_List";
import Content_1 from "./Content_1";
import Content_2 from "./Content_2";
import Footer from "./Footer";
class App extends Component {
render() {
return (
<div class="wrapper">
<Header />
<Featured_Content />
<Content />
<Content_List />
<Content_1 />
<Content_2 />
<Footer />
</div>
);
}
}
export default App;
\ No newline at end of file
react-template-site/src/components/Content.js 0 → 100644
+ 56
− 0
View file @ 0bf288f7
import React from "react";
import Slider from "react-slick";
class Content extends React.Component {
render(){
var data = require('../data/data.json');
const settings = {
dots: false,
infinite: false,
speed: 300,
slidesToShow: 5,
slidesToScroll: 5,
responsive: [
{
breakpoint: 1024,
settings: {
slidesToShow: 4,
slidesToScroll: 4,
infinite: false,
dots: false
}
},
{
breakpoint: 600,
settings: {
slidesToShow: 3,
slidesToScroll: 3,
initialSlide: 3
}
},
{
breakpoint: 480,
settings: {
slidesToShow: 2,
slidesToScroll: 2
}
}
]
};
return(
<div class="container-fluid layout ">
<h2>Title</h2>
<Slider {...settings} class="row">
{data.map(( item, key)=>(
<div key ={key} class="col-sm-3">
<img class="img-responsive center-block" src={item.image}/>
</div>
))}
</Slider>
</div>
)
}
}
export default Content;
\ No newline at end of file
react-template-site/src/components/Content_1.js 0 → 100644
+ 21
− 0
View file @ 0bf288f7
import React from "react";
class Content_1 extends React.Component {
render(){
var data = require('../data/data_1.json');
return(
<div class="container-fluid layout">
<h2>Title</h2>
<div class="row">
{data.map(( item, key)=>(
<div key ={key} class="col layout">
<img src={item.image}/>
</div>
))}
</div>
</div>)
}
}
export default Content_1;
\ No newline at end of file
react-template-site/src/components/Content_2.js 0 → 100644
+ 22
− 0
View file @ 0bf288f7
import React from "react";
class Content_2 extends React.Component {
render(){
var data = require('../data/data_2.json');
return(
<div class="container-fluid layout">
<h2>Title</h2>
<div class="row">
{data.map(( item, key)=>(
<div key ={key} class="col layout">
<img src={item.image}/>
</div>
))}
</div>
</div>)
}
}
export default Content_2;
\ No newline at end of file
react-template-site/src/components/Content_List.js 0 → 100644
+ 52
− 0
View file @ 0bf288f7
import React from "react";
import Slider from "react-slick";
class Content_List extends React.Component {
render() {
var data = require('../data/data-list.json');
const settings = {
dots: false,
infinite: false,
speed: 300,
slidesToShow: 5,
slidesToScroll: 5,
responsive: [
{
breakpoint: 1024,
settings: {
slidesToShow: 4,
slidesToScroll: 4,
infinite: false,
dots: false
}
},
{
breakpoint: 600,
settings: {
slidesToShow: 3,
slidesToScroll: 3,
initialSlide: 3
}
},
{
breakpoint: 480,
settings: {
slidesToShow: 2,
slidesToScroll: 2
}
}
]
};
return (<div class="container-fluid layout ">
<h2>Title</h2>
<Slider {...settings} class="row">
{data.map(( item, key)=>(
<div key ={key} class="col ">
<img class="img-responsive center-block" src={item.image}/>
</div>
))}
</Slider>
</div>);
}
}
export default Content_List;
\ No newline at end of file
react-template-site/src/components/Featured_Content.js 0 → 100644
+ 21
− 0
View file @ 0bf288f7
import React from "react";
class Featured_Content extends React.Component {
render(){
var data = require('../data/data-featured-content.json');
return(
<div class="container-fluid layout">
<h2>Title</h2>
<div class="row">
{data.map(( item, key)=>(
<div key ={key} class="col layout">
<img src={item.image}/>
</div>
))}
</div>
</div>
)
}
}
export default Featured_Content;
\ No newline at end of file
react-template-site/src/components/Footer.js 0 → 100644
+ 14
− 0
View file @ 0bf288f7
import React from "react";
import '../styles/App.css';
class Footer extends React.Component {
render(){
return(
<div class="footer">
<p>Footer</p>
</div>
)
}
}
export default Footer;
\ No newline at end of file
react-template-site/src/components/Header.js 0 → 100644
+ 23
− 0
View file @ 0bf288f7
import React from "react";
import Logo from './Logo';
class Header extends React.Component {
render(){
return(
<div class="header">
<Logo />
<div className="container-fluid layout">
<h2>Title</h2>
Lorem ipsum dolor sit amet, consectetur adipiscing elit.<br />
Proin id nisl eget libero consequat posuere. Cras faucibus <br />
imperdiet iaculis. Maecenas luctus luctus nisi, ac auctor felis<br />
luctus a. Fusce lorem lorem, tristique id condimentum id, <br />
placerat at diam. <br />
</div>
</div>)
}
}
export default Header;
\ No newline at end of file
react-template-site/src/components/Logo.js 0 → 100644
+ 21
− 0
View file @ 0bf288f7
import React from "react";
import '../styles/App.css';
class Logo extends React.Component {
render(){
return(
<div class="container-fluid layout">
<div class="row pad">
<div class="col-3">
NetEnt Games Logo
</div>
<div class="col-4">
Icons
</div>
</div>
</div>)
}
}
export default Logo;
\ No newline at end of file
react-template-site/src/data/data-featured-content.json 0 → 100644
+ 10
− 0
View file @ 0bf288f7
[
{
"image":"https://dummyimage.com/120"
}, {
"image":"https://dummyimage.com/120"
},{
"image":"https://dummyimage.com/120"
}
]
\ No newline at end of file
react-template-site/src/data/data-list.json 0 → 100644
+ 16
− 0
View file @ 0bf288f7
[
{
"image":"https://dummyimage.com/120"
}, {
"image":"https://dummyimage.com/120"
},{
"image":"https://dummyimage.com/120"
},{
"image":"https://dummyimage.com/120"
},{
"image":"https://dummyimage.com/120"
},{
"image":"https://dummyimage.com/120"
}
]
\ No newline at end of file
react-template-site/src/data/data.json 0 → 100644
+ 16
− 0
View file @ 0bf288f7
[
{
"image":"https://dummyimage.com/120"
}, {
"image":"https://dummyimage.com/120"
},{
"image":"https://dummyimage.com/120"
},{
"image":"https://dummyimage.com/120"
},{
"image":"https://dummyimage.com/120"
},{
"image":"https://dummyimage.com/120"
}
]
\ No newline at end of file
react-template-site/src/data/data_1.json 0 → 100644
+ 14
− 0
View file @ 0bf288f7
[
{
"image":"https://dummyimage.com/120"
}, {
"image":"https://dummyimage.com/120"
},{
"image":"https://dummyimage.com/120"
},{
"image":"https://dummyimage.com/120"
},{
"image":"https://dummyimage.com/120"
}
]
\ No newline at end of file
react-template-site/src/data/data_2.json 0 → 100644
+ 20
− 0
View file @ 0bf288f7
[
{
"image":"https://dummyimage.com/120"
}, {
"image":"https://dummyimage.com/120"
},{
"image":"https://dummyimage.com/120"
},{
"image":"https://dummyimage.com/120"
},{
"image":"https://dummyimage.com/120"
},{
"image":"https://dummyimage.com/120"
},{
"image":"https://dummyimage.com/120"
},{
"image":"https://dummyimage.com/120"
}
]
\ No newline at end of file
react-template-site/src/index.html 0 → 100755
+ 21
− 0
View file @ 0bf288f7
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>React Boilerplate</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" charset="UTF-8" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.min.css" />
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick-theme.min.css" />
</head>
<body>
<div id="root">
</div>
</body>
</html>
\ No newline at end of file
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment