tiuweehan / cvwo Goto Github PK

Installation Guide for Ruby on Rails 6 with React

cvwo's Introduction

Gatsby + Netlify CMS Starter

Note: This starter uses Gatsby v2.

This repo contains an example business website that is built with Gatsby, and Netlify CMS: Demo Link.

It follows the JAMstack architecture by using Git as a single source of truth, and Netlify for continuous deployment, and CDN distribution.

Features

A simple landing page with blog functionality built with Netlify CMS
Editable Pages: Landing, About, Experience, Blog-Collection and Contact page with Netlify Form support
Create Blog posts from Netlify CMS
Tags: Separate page for posts under each tag
Basic directory organization
Uses Bulma for styling, but size is reduced by purge-css-plugin
Blazing fast loading times thanks to pre-rendered HTML and automatic chunk loading of JS files
Uses gatsby-image with Netlify-CMS preview support
Separate components for everything
Netlify deploy configuration
Netlify function support, see lambda folder
Perfect score on Lighthouse for SEO, Accessibility and Performance (wip:PWA)
..and more

Prerequisites

Node (I recommend using v8.2.0 or higher)
Gatsby CLI
Netlify CLI

Getting Started (Recommended)

Netlify CMS can run in any frontend web environment, but the quickest way to try it out is by running it on a pre-configured starter site with Netlify. The example here is the Kaldi coffee company template (adapted from One Click Hugo CMS). Use the button below to build and deploy your own copy of the repository:

After clicking that button, you’ll authenticate with GitHub and choose a repository name. Netlify will then automatically create a repository in your GitHub account with a copy of the files from the template. Next, it will build and deploy the new site on Netlify, bringing you to the site dashboard when the build is complete. Next, you’ll need to set up Netlify’s Identity service to authorize users to log in to the CMS.

Access Locally

Pulldown a local copy of the Github repository Netlify created for you, with the name you specified in the previous step

$ git clone https://github.com/[GITHUB_USERNAME]/[REPO_NAME].git
$ cd [REPO_NAME]
$ yarn
$ netlify dev # or ntl dev

This uses the new Netlify Dev CLI feature to serve any functions you have in the lambda folder.

To test the CMS locally, you'll need to run a production build of the site:

$ npm run build
$ netlify dev # or ntl dev

Media Libraries (installed, but optional)

Media Libraries have been included in this starter as a default. If you are not planning to use Uploadcare or Cloudinary in your project, you can remove them from module import and registration in src/cms/cms.js. Here is an example of the lines to comment or remove them your project.

import CMS from 'netlify-cms-app'
// import uploadcare from 'netlify-cms-media-library-uploadcare'
// import cloudinary from 'netlify-cms-media-library-cloudinary'

import AboutPagePreview from './preview-templates/AboutPagePreview'
import BlogPostPreview from './preview-templates/BlogPostPreview'
import ExperiencePagePreview from './preview-templates/ExperiencePagePreview'
import IndexPagePreview from './preview-templates/IndexPagePreview'

// CMS.registerMediaLibrary(uploadcare);
// CMS.registerMediaLibrary(cloudinary);

CMS.registerPreviewTemplate('index', IndexPagePreview)
CMS.registerPreviewTemplate('about', AboutPagePreview)
CMS.registerPreviewTemplate('experience', ExperiencePagePreview)
CMS.registerPreviewTemplate('blog', BlogPostPreview)

Note: Don't forget to also remove them from package.json and yarn.lock / package-lock.json using yarn or npm. During the build netlify-cms-app will bundle the media libraries as well, having them removed will save you build time. Example:

yarn remove netlify-cms-media-library-uploadcare

yarn remove netlify-cms-media-library-cloudinary

Getting Started (Without Netlify)

$ gatsby new [SITE_DIRECTORY_NAME] https://github.com/netlify-templates/gatsby-starter-netlify-cms/
$ cd [SITE_DIRECTORY_NAME]
$ npm run build
$ npm run serve

Setting up the CMS

Follow the Netlify CMS Quick Start Guide to set up authentication, and hosting.

Debugging

Windows users might encounter node-gyp errors when trying to npm install. To resolve, make sure that you have both Python 2.7 and the Visual C++ build environment installed.

npm config set python python2.7
npm install --global --production windows-build-tools

Full details here

MacOS users might also encounter some errors, for more info check node-gyp. We recommend using the latest stable node version.

Purgecss

This plugin uses gatsby-plugin-purgecss and bulma. The bulma builds are usually ~170K but reduced 90% by purgecss.

CONTRIBUTING

Contributions are always welcome, no matter how large or small. Before contributing, please read the code of conduct.

cvwo's People

Contributors

Stargazers

Watchers

Forkers

zhuhanming aqcd

cvwo's Issues

Unable to create new Rails application (chmod operation not permited)

nicktohzyu@nicktohzyu-PC:/mnt/c/code$ rails new my-app --webpack=react -d postgresql
create
create README.md
create Rakefile
create .ruby-version
create config.ru
create .gitignore
create Gemfile
run git init from "."
/home/nicktohzyu/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/thor-1.0.0/lib/thor/actions.rb:266: warning: Insecure world writable dir /home/nicktohzyu/.rbenv/versions/2.6.5 in PATH, mode 040777
error: chmod on /mnt/c/code/my-app/.git/config.lock failed: Operation not permitted
fatal: could not set 'core.filemode' to 'false'

Error creating new app WSL

Trying to create new app, error says to bundle install; when trying to bundle install error says to run a line of code, more errors ensue

nicktohzyu@nicktohzyu-PC:/mnt/c/code$ rails new myapp -d postgresql
exist
identical README.md
identical Rakefile
identical .ruby-version
identical config.ru
conflict .gitignore
Overwrite /mnt/c/code/myapp/.gitignore? (enter "h" for help) [Ynaqdhm]
force .gitignore
identical Gemfile
run git init from "."
/home/nicktohzyu/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/thor-1.0.0/lib/thor/actions.rb:266: warning: Insecure world writable dir /home/nicktohzyu/.rbenv/versions/2.6.5 in PATH, mode 040777
Reinitialized existing Git repository in /mnt/c/code/myapp/.git/
identical package.json
exist app
identical app/assets/config/manifest.js
identical app/assets/stylesheets/application.css
identical app/channels/application_cable/channel.rb
identical app/channels/application_cable/connection.rb
identical app/controllers/application_controller.rb
identical app/helpers/application_helper.rb
identical app/javascript/channels/consumer.js
identical app/javascript/channels/index.js
identical app/javascript/packs/application.js
identical app/jobs/application_job.rb
identical app/mailers/application_mailer.rb
identical app/models/application_record.rb
identical app/views/layouts/application.html.erb
identical app/views/layouts/mailer.html.erb
identical app/views/layouts/mailer.text.erb
identical app/assets/images/.keep
identical app/controllers/concerns/.keep
identical app/models/concerns/.keep
exist bin
identical bin/rails
identical bin/rake
identical bin/setup
identical bin/yarn
exist config
identical config/routes.rb
identical config/application.rb
identical config/environment.rb
identical config/cable.yml
identical config/puma.rb
identical config/spring.rb
identical config/storage.yml
exist config/environments
identical config/environments/development.rb
identical config/environments/production.rb
identical config/environments/test.rb
exist config/initializers
identical config/initializers/application_controller_renderer.rb
identical config/initializers/assets.rb
identical config/initializers/backtrace_silencers.rb
identical config/initializers/content_security_policy.rb
identical config/initializers/cookies_serializer.rb
create config/initializers/cors.rb
identical config/initializers/filter_parameter_logging.rb
identical config/initializers/inflections.rb
identical config/initializers/mime_types.rb
create config/initializers/new_framework_defaults_6_0.rb
identical config/initializers/wrap_parameters.rb
exist config/locales
identical config/locales/en.yml
append .gitignore
identical config/boot.rb
identical config/database.yml
exist db
identical db/seeds.rb
exist lib
exist lib/tasks
identical lib/tasks/.keep
exist lib/assets
identical lib/assets/.keep
exist log
identical log/.keep
exist public
identical public/404.html
identical public/422.html
identical public/500.html
identical public/apple-touch-icon-precomposed.png
identical public/apple-touch-icon.png
identical public/favicon.ico
identical public/robots.txt
exist tmp
identical tmp/.keep
exist tmp/cache
exist tmp/cache/assets
exist vendor
identical vendor/.keep
exist test/fixtures
identical test/fixtures/.keep
exist test/fixtures/files
identical test/fixtures/files/.keep
exist test/controllers
identical test/controllers/.keep
exist test/mailers
identical test/mailers/.keep
exist test/models
identical test/models/.keep
exist test/helpers
identical test/helpers/.keep
exist test/integration
identical test/integration/.keep
identical test/channels/application_cable/connection_test.rb
identical test/test_helper.rb
exist test/system
identical test/system/.keep
identical test/application_system_test_case.rb
exist storage
identical storage/.keep
exist tmp/storage
identical tmp/storage/.keep
remove config/initializers/cors.rb
remove config/initializers/new_framework_defaults_6_0.rb
run bundle install
The dependency tzinfo-data (>= 0) will be unused by any of the platforms Bundler is installing for. Bundler is installing for ruby but the dependency is only for x86-mingw32, x86-mswin32, x64-mingw32, java. To add those platforms to the bundle, run bundle lock --add-platform x86-mingw32 x86-mswin32 x64-mingw32 java.
Fetching gem metadata from https://rubygems.org/............
Fetching gem metadata from https://rubygems.org/.
Resolving dependencies...
Using rake 13.0.1
Using concurrent-ruby 1.1.5
Using i18n 1.7.0
Using minitest 5.13.0
Using thread_safe 0.3.6
Using tzinfo 1.2.5
Using zeitwerk 2.2.2
Using activesupport 6.0.2
Using builder 3.2.4
Using erubi 1.9.0
Using mini_portile2 2.4.0
Using nokogiri 1.10.7
Using rails-dom-testing 2.0.3
Using crass 1.0.5
Using loofah 2.4.0
Using rails-html-sanitizer 1.3.0
Using actionview 6.0.2
Using rack 2.0.7
Using rack-test 1.1.0
Using actionpack 6.0.2
Using nio4r 2.5.2
Using websocket-extensions 0.1.4
Using websocket-driver 0.7.1
Using actioncable 6.0.2
Using globalid 0.4.2
Using activejob 6.0.2
Using activemodel 6.0.2
Using activerecord 6.0.2
Using mimemagic 0.3.3
Using marcel 0.3.3
Using activestorage 6.0.2
Using mini_mime 1.0.2
Using mail 2.7.1
Using actionmailbox 6.0.2
Using actionmailer 6.0.2
Using actiontext 6.0.2
Using public_suffix 4.0.1
Using addressable 2.7.0
Using bindex 0.8.1
Using msgpack 1.3.1
Using bootsnap 1.4.5
Using bundler 2.1.1
Using byebug 11.0.1
Using regexp_parser 1.6.0
Using xpath 3.2.0
Using capybara 3.29.0
Using childprocess 3.0.0
Using ffi 1.11.3
Using jbuilder 2.9.1
Using rb-fsevent 0.10.3
Using rb-inotify 0.10.0
Using ruby_dep 1.5.0
Using listen 3.1.5
Using method_source 0.9.2
Fetching pg 1.1.4
Installing pg 1.1.4 with native extensions
Gem::Ext::BuildError: ERROR: Failed to build gem native extension.

current directory: /home/nicktohzyu/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/pg-1.1.4/ext

/home/nicktohzyu/.rbenv/versions/2.6.5/bin/ruby -I /home/nicktohzyu/.rbenv/versions/2.6.5/lib/ruby/2.6.0 -r
./siteconf20191218-879-16adbc1.rb extconf.rb
checking for pg_config... no
No pg_config... trying anyway. If building fails, please try again with
--with-pg-config=/path/to/pg_config
checking for libpq-fe.h... no
Can't find the 'libpq-fe.h header
*** extconf.rb failed ***
Could not create Makefile due to some reason, probably lack of necessary
libraries and/or headers. Check the mkmf.log file for more details. You may
need configuration options.

Provided configuration options:
--with-opt-dir
--without-opt-dir
--with-opt-include
--without-opt-include=${opt-dir}/include
--with-opt-lib
--without-opt-lib=${opt-dir}/lib
--with-make-prog
--without-make-prog
--srcdir=.
--curdir
--ruby=/home/nicktohzyu/.rbenv/versions/2.6.5/bin/$(RUBY_BASE_NAME)
--with-pg
--without-pg
--enable-windows-cross
--disable-windows-cross
--with-pg-config
--without-pg-config
--with-pg_config
--without-pg_config
--with-pg-dir
--without-pg-dir
--with-pg-include
--without-pg-include=${pg-dir}/include
--with-pg-lib
--without-pg-lib=${pg-dir}/lib

To see why this extension failed to compile, please check the mkmf.log which can be found here:

/home/nicktohzyu/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/extensions/x86_64-linux/2.6.0/pg-1.1.4/mkmf.log

extconf failed, exit code 1

Gem files will remain installed in /home/nicktohzyu/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/pg-1.1.4 for
inspection.
Results logged to
/home/nicktohzyu/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/extensions/x86_64-linux/2.6.0/pg-1.1.4/gem_make.out

An error occurred while installing pg (1.1.4), and Bundler cannot continue.
Make sure that gem install pg -v '1.1.4' --source 'https://rubygems.org/' succeeds before bundling.

In Gemfile:
pg
run bundle binstubs bundler
Could not find gem 'pg (>= 0.18, < 2.0)' in any of the gem sources listed in your Gemfile.
run bundle exec spring binstub --all
bundler: command not found: spring
Install missing gem executables with bundle install
rails webpacker:install
/home/nicktohzyu/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/railties-6.0.0/lib/rails/app_loader.rb:53: warning: Insecure world writable dir /home/nicktohzyu/.rbenv/versions/2.6.5 in PATH, mode 040777
Could not find gem 'pg (>= 0.18, < 2.0)' in any of the gem sources listed in your Gemfile.
Run bundle install to install missing gems.

nicktohzyu@nicktohzyu-PC:/mnt/c/code/myapp$ bundle install
The dependency tzinfo-data (>= 0) will be unused by any of the platforms Bundler is installing for. Bundler is installing for ruby but the dependency is only for x86-mingw32, x86-mswin32, x64-mingw32, java. To add those platforms to the bundle, run bundle lock --add-platform x86-mingw32 x86-mswin32 x64-mingw32 java.
Fetching gem metadata from https://rubygems.org/............
Fetching gem metadata from https://rubygems.org/.
Resolving dependencies...
Using rake 13.0.1
Using concurrent-ruby 1.1.5
Using i18n 1.7.0
Using minitest 5.13.0
Using thread_safe 0.3.6
Using tzinfo 1.2.5
Using zeitwerk 2.2.2
Using activesupport 6.0.2
Using builder 3.2.4
Using erubi 1.9.0
Using mini_portile2 2.4.0
Using nokogiri 1.10.7
Using rails-dom-testing 2.0.3
Using crass 1.0.5
Using loofah 2.4.0
Using rails-html-sanitizer 1.3.0
Using actionview 6.0.2
Using rack 2.0.7
Using rack-test 1.1.0
Using actionpack 6.0.2
Using nio4r 2.5.2
Using websocket-extensions 0.1.4
Using websocket-driver 0.7.1
Using actioncable 6.0.2
Using globalid 0.4.2
Using activejob 6.0.2
Using activemodel 6.0.2
Using activerecord 6.0.2
Using mimemagic 0.3.3
Using marcel 0.3.3
Using activestorage 6.0.2
Using mini_mime 1.0.2
Using mail 2.7.1
Using actionmailbox 6.0.2
Using actionmailer 6.0.2
Using actiontext 6.0.2
Using public_suffix 4.0.1
Using addressable 2.7.0
Using bindex 0.8.1
Using msgpack 1.3.1
Using bootsnap 1.4.5
Using bundler 2.1.1
Using byebug 11.0.1
Using regexp_parser 1.6.0
Using xpath 3.2.0
Using capybara 3.29.0
Using childprocess 3.0.0
Using ffi 1.11.3
Using jbuilder 2.9.1
Using rb-fsevent 0.10.3
Using rb-inotify 0.10.0
Using ruby_dep 1.5.0
Using listen 3.1.5
Using method_source 0.9.2
Fetching pg 1.1.4
Installing pg 1.1.4 with native extensions
Gem::Ext::BuildError: ERROR: Failed to build gem native extension.

current directory: /home/nicktohzyu/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/pg-1.1.4/ext

/home/nicktohzyu/.rbenv/versions/2.6.5/bin/ruby -I /home/nicktohzyu/.rbenv/versions/2.6.5/lib/ruby/2.6.0 -r
./siteconf20191218-1030-kewin4.rb extconf.rb
checking for pg_config... no
No pg_config... trying anyway. If building fails, please try again with
--with-pg-config=/path/to/pg_config
checking for libpq-fe.h... no
Can't find the 'libpq-fe.h header
*** extconf.rb failed ***
Could not create Makefile due to some reason, probably lack of necessary
libraries and/or headers. Check the mkmf.log file for more details. You may
need configuration options.

To see why this extension failed to compile, please check the mkmf.log which can be found here:

/home/nicktohzyu/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/extensions/x86_64-linux/2.6.0/pg-1.1.4/mkmf.log

extconf failed, exit code 1

An error occurred while installing pg (1.1.4), and Bundler cannot continue.
Make sure that gem install pg -v '1.1.4' --source 'https://rubygems.org/' succeeds before bundling.

In Gemfile:
pg

nicktohzyu@nicktohzyu-PC:/mnt/c/code/myapp$ gem install pg -v '1.1.4' --source 'https://rubygems.org/'
Building native extensions. This could take a while...
/home/nicktohzyu/.rbenv/versions/2.6.5/lib/ruby/2.6.0/rubygems/ext/builder.rb:76: warning: Insecure world writable dir /home/nicktohzyu/.rbenv/versions/2.6.5 in PATH, mode 040777
ERROR: Error installing pg:
ERROR: Failed to build gem native extension.

current directory: /home/nicktohzyu/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/pg-1.1.4/ext

/home/nicktohzyu/.rbenv/versions/2.6.5/bin/ruby -I /home/nicktohzyu/.rbenv/versions/2.6.5/lib/ruby/2.6.0 -r ./siteconf20191218-1093-1crrtv7.rb extconf.rb
checking for pg_config... no
No pg_config... trying anyway. If building fails, please try again with
--with-pg-config=/path/to/pg_config
checking for libpq-fe.h... no
Can't find the 'libpq-fe.h header
*** extconf.rb failed ***
Could not create Makefile due to some reason, probably lack of necessary
libraries and/or headers. Check the mkmf.log file for more details. You may
need configuration options.

To see why this extension failed to compile, please check the mkmf.log which can be found here:

/home/nicktohzyu/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/extensions/x86_64-linux/2.6.0/pg-1.1.4/mkmf.log

extconf failed, exit code 1

Gem files will remain installed in /home/nicktohzyu/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/pg-1.1.4 for inspection.
Results logged to /home/nicktohzyu/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/extensions/x86_64-linux/2.6.0/pg-1.1.4/gem_make.out

missing folders when create a new rails project

Hi, I ran to this issue when running rails new:

This is my tester folder created by that code:

How can I solve this problem? Thank you.

I'm using window 10 (64 bit), ruby 2.6.5p114 [x64-mingw32], rails 6.0.2, sqlite3 version 3.30.1

[Windows] Operation not permitted for rails new myapp

When I run
rails new my-app --webpack=react -d postgresql
I get the following error:

Does anyone know how to obtain permission?

gem install pg -v bundle missing

if you encounter this problem, run "sudo apt install postgresql-contrib libpq-dev" and try running "rails new my-app --webpack=react -d postgresql" again, it should work fine.

Forum Guidelines

CVWO 2020 Winter Assignment Forums

Welcome to the CVWO 2020 Winter assignment forums! Do take note of the guidelines below.

Guidelines for forum posts

The forums are strictly for technical issues only. Please do not discuss administrative issues for the assignment.
For every forum post, do add a label to indicate which operating system (Windows, Mac or Linux) you are using (if applicable).

failed to install homebrew

when I use mac terminal to download homebrew, it says:
Failed during: git fetch origin master:refs/remotes/origin/master --tags --force
MegandeMacBook-Pro:~ meganwang$ ruby -e "$(curl -fsSL https://raw.github.com/Homebrew/homebrew/go/install)"
curl: (7) Failed to connect to raw.github.com port 443: Connection refused

stuck at the step "rake db:create"

unable to get past this step, anyone can help me?
using PostgreSQL here.

Can't get helloworld react component to show

Followed the guide adding <%= react_component("HelloWorld", { greeting: "Hello from react-rails." }) %> to erb file, but it does not change the page. In contrast, when I add text it shows up on the page

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
D3

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web

Some thing interesting about web. New door for the world.
server

A server is a program made to process requests and deliver data to clients.
Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.