Eth3rnit3

import React from 'react';
import './App.css';
import Uploader from './uploader';

const fetchTestDatas = function () {
  fetch('/api/v1/tests')
    .then(res => res.json())
    .then((response) => { console.log("Test datas response", response); })
    .catch((error) => { console.log("Error while fetching test datas", error); })
}

Eth3rnit3

import React from 'react'
import Axios from 'axios'

const submitForm = function (event) {
  event.preventDefault();
  let formData = new FormData(event.target);
  Axios.post('/api/v1/uploads', formData)
    .then(res => {
      alert(`File has been uploaded ${res.data.url}`)
    })

Eth3rnit3

import React from 'react'
import Axios from 'axios'

const submitForm = function (event) {
  event.preventDefault();
  let formData = new FormData(event.target);
  console.log(formData.get('upload[file]'))
  Axios.post('/api/v1/uploads', formData)
    .then(res => {
      console.log(res)

Eth3rnit3

class Api::V1::UploadsController < ApplicationController
  def create
    @upload = Upload.new(upload_params)
    if @upload.save
      render json: {upload: @upload}
    else
      render json: {error: @upload.errors.full_messages}, status: 422
    end
  end

Eth3rnit3

class Upload < ApplicationRecord
  has_one_attached :file

  after_create :build_url

  private

  def build_url
    update_column(:url, Rails.application.routes.url_helpers.rails_blob_path(file, only_path: true)) if file.attached?
  end

Eth3rnit3

class Upload < ApplicationRecord
  has_one_attached :file
end

Eth3rnit3

web: cd client && yarn start
api: bundle exec rails s -p 3000

Eth3rnit3

class ApplicationController < ActionController::API
  def frontend_index_html
    render file: 'public/index.html'
  end
end

Eth3rnit3

Rails.application.routes.draw do
  namespace :api do
    namespace :v1 do
      get 'tests', to: 'tests#index'
    end
  end

  get '*path', to: 'application#frontend_index_html', constraints: lambda { |request|
      !request.xhr? && request.format.html?
    }

Eth3rnit3

{
  "name": "client",
  "version": "0.1.0",
  "proxy": "http://127.0.0.1:3000",
  "private": true,
  "dependencies": {
    "react": "^16.9.0",
    "react-dom": "^16.9.0",
    "react-scripts": "3.1.1"
  },