iciamyplant /
Minishell
This is my final 42's project Minishell, I implemented my own shell in C, which supports redirections, pipes, environment variables and several builtins
64/100 healthLoading repository data…
wsberry / repository
This project implements a simple C++ project using CMake that may be compiled from your host environment or from a Docker container that hosts the latest Alpine Linux OS with Clang 14.0 installed.
A transparent discovery signal based on current public GitHub metadata.
This score does not audit code, security, maintainers, documentation quality, or suitability. Verify the repository and its current documentation before adoption.
Docker is a great tool when cross-compiling projects. It enables you to check for compile time errors while working from an IDE on your local machine and quickly compile the code using a different operating system or compiler version.
This project implements a simple C++ project using CMake that may be compiled from your host environment or from a Docker container that hosts the latest Alpine Linux OS with Clang 14.0 installed.
The code demonstrated in the hello-world-test project provides a sample of a fold expression and therefore does require C++ 20 when compiling on your local machine.
So far this has been tested on Windows 10+, macOS Moterey 12+, Ubuntu 22.04 LTS, and, on Alpine Linux (latest) using a Docker container (described here).
- Docker Desktop - Git - CMake - Bash (Git bash may be used for Windows)
Bash 3.2.57 is the default version that comes with the macOS. The scripts provided in this demo require version 5 and above.
To install the latest version of bash on the macOS run ./scripts/install-bash-mac-os.sh to update your system. On some systems when cloning this repository, the 'executable' attribute may have been removed. Therefore, you may need to run {sudo} chmod +x install-bash-mac-os.sh to enable the script to be run as an executable again in bash:
$ chmod +x ./scripts/install-bash-mac-os.sh
$ ./scripts/install-bash-mac-os.sh
If you have the prerequisites installed you may run the following from a terminal:
cd compiler-services
./create-docker-service -b
./build-project.sh -bi
The Dockerfile, ./compiler-services/alpine-latest-clang-14.0-build-service.dockerfile, contains the commands to create a Docker image called 'alpine-latest-clang-14.0-build-service':
# Alpine is a Linux distribution built around musl libc and BusyBox.
#
# https://alpinelinux.org/
#
FROM alpine:latest
LABEL Description = "A Clang 14 Build Service on Alpine Linux Latest."
ENV PROJECT_DIR /project
WORKDIR ${PROJECT_DIR}
# Install dev tools to build the C++ project.
#
RUN apk update \
&& apk upgrade \
&& apk add --no-cache \
bash \
alpine-sdk \
ccache \
clang \
clang-dev \
cmake \
dpkg
# nano
# Finalize Setup
#
RUN ln -sf /usr/bin/clang /usr/bin/cc \
&& ln -sf /usr/bin/clang++ /usr/bin/c++ \
&& update-alternatives --install /usr/bin/cc cc /usr/bin/clang 14\
&& update-alternatives --install /usr/bin/c++ c++ /usr/bin/clang++ 14\
&& update-alternatives --auto cc \
&& update-alternatives --auto c++ \
&& update-alternatives --display cc \
&& update-alternatives --display c++ \
&& ls -l /usr/bin/cc /usr/bin/c++ \
&& cc --version \
&& c++ --version \
&& clang --version
# Contains CMake/çompile time instructions.
#
ENTRYPOINT ["./entry-points/build.sh"]
A helper script named, ./scripts/create-docker-service.sh, may be used to build or remove any docker images created from this dockerfile:
#!/usr/bin/env bash
#!/bin/bash
source "../scripts/core.sh"
root_dir=${PWD}
CLANG_VERSION="Clang 14.0"
DOCKER_SERVICE_VERSION=1.0.0
DOCKER_WORKDIR="projects"
DOCKER_SERVICE_NAME="alpine-latest-clang-14.0-build-service"
DOCKER_FILE="${DOCKER_SERVICE_NAME}.dockerfile"
LINUX_TYPE="Alpine Linux"
LINUX_URL="https://alpinelinux.org/"
export DOCKER_BUILDKIT=0
export COMPOSE_DOCKER_CLI_BUILD=0
clear
function help_about()
{
echo -e "\n${IYellow}Overview:${IDefault}\nCreate a Docker image for compiling CPP"\
" projects on ${LINUX_TYPE} (${LINUX_URL}) using ${CLANG_VERSION}."\
"\nThe resulting Docker image is named '${DOCKER_SERVICE_NAME}'."\
"\n\n${IYellow}Options for using this script:${IPurple}"\
" \n '-b${IDefault} or ${IPurple}--build'"\
" \n '-r${IDefault} or ${IPurple}--remove'${IDefault}\n"\
"\n${IWhite}Example:${IDefault}\n ./create-docker-service -b\n"
ls "${DOCKER_FILE}"
echo "alpine-latest-clang-14.0-build-service.dockerfile"
}
function remove_service_image()
{
docker rmi -f "${DOCKER_SERVICE_NAME}:${DOCKER_SERVICE_VERSION}"
}
function build_service_image()
{
remove_service_image
docker build -t "${DOCKER_SERVICE_NAME}:${DOCKER_SERVICE_VERSION}" -f "${DOCKER_FILE}" .
}
# Run Options:
#
if [[ "-b" == "$1" || "--build" == "$1" ]]; then
build_service_image
elif [[ "-r" == "$1" || "--remove" == "$1" ]]; then
remove_service_image
else
help_about
fi
Once you have the service created you are ready to build the provided project. The instructions for this are defined in the ./compiler-services/build-project.sh bash script:
#!/usr/bin/env bash
#!/bin/bash
# -----------------------------------------------------------------------------------------
# Copyright (c) William Berry
# email: wberry.cpp@gmail.com
# github: https://github.com/wsberry
#
# Description:
# Use this script to build the 'hello-world-test' project.
# See the 'help_about' function for the available options.
# -----------------------------------------------------------------------------------------
# Docker Specific Paths.
#
DOCKER_IMAGE_NAME="alpine-latest-clang-14.0-build-service"
DOCKER_FILE="${DOCKER_IMAGE_NAME}.dockerfile"
# DOCKER_IMAGE_VERSION:
#
# The version of the docker image to use. This is a tag that is used when the docker image was created.
#
# I.e.,
# docker build -t {DOCKER_IMAGE_NAME}:{DOCKER_IMAGE_VERSION} -f {DOCKER_FILE}
#
DOCKER_IMAGE_VERSION=1.0.0
# Project Settings (these are things you may want to make changes to)
#
. project-settings.sh
RUN_VERBOSE="false"
if [[ "$1" == *"v"* ]];
then
RUN_VERBOSE="true"
fi
# The following are defined in project-settings
#
find_cmake_source_dir
validate_settings
create_docker_environment_file
function help_about()
{
tabs 3
echo -e "${IYellow}Options:${IDefault}"\
"\n ${IPurple} '-bi'${IDefault} - Run build interactively with the Alpine image and Clang 14.0."\
"\n ${IPurple} '-bd'${IDefault} - Run build detached with the Alpine image and Clang 14.0."\
"\n ${IPurple} '-bl'${IDefault} - Build using the default CMake generator on your account."\
"\n ${IPurple} '-ba'${IDefault} - Build all; build on Alpine and your host machine).\n"\
"\n${IYellow}Example:${IPurple} ./build-project.sh -bi\n"\
"\n${IYellow}Notes:${IDefault}"\
"\n 1. For verbose output add 'v' to the option flag you are using (e.g., -bdv)."\
"\n 2. Add 'c' to the option flag to reload cmake and rebuild all (e.g., -bdc).\n"
}
# Note: Using Docker Volumes to mount the local directory contents into
# the docker container instance.
#
# See 'https://docs.docker.com/storage/volumes/' for details.
#
# TODO: Create a docker compose example.
#
function build_interactive()
{
echo -e "\n${IYellow}Building on Alpine (interactive)...${IDefault}"
sleep 2
PN="${PROJECT_DIR_NAME}"
# Note absolute paths are required here.
#
docker run --env-file env.txt "-i" --rm --name="build_${PN}_interactive"\
--mount type=bind,source="${CMAKE_SOURCE_DIR}",target="/${DOCKER_WORKDIR}"\
"${DOCKER_IMAGE_NAME}:${DOCKER_IMAGE_VERSION}" bash
}
function build_detached()
{
echo -e "\n${IYellow}Building on Alpine (detached)...${IDefault}"
sleep 2
PN="${PROJECT_DIR_NAME}"
# Note absolute paths are required here.
#
docker run --env-file env.txt -d --rm --name="build_${PN}_detached"\
--mount type=bind,source="${CMAKE_SOURCE_DIR}",target="/${DOCKER_WORKDIR}"\
"${DOCKER_IMAGE_NAME}:${DOCKER_IMAGE_VERSION}" bash
}
function build_local()
{
echo -e "\n${IYellow}Building on local Machine...${IDefault}"
sleep 2
export LOCAL_MACHINE='true'
"${CMAKE_SOURCE_DIR}/${ENTRY_POINTS_DIR}/build.sh"
}
# Add 'c' to option key (short form) to clean and rebuild all.
#
if [[ "$1" == *"c"* ]];
then
rm -Rf "${CMAKE_SOURCE_DIR}/${INSTALL_DIR}"
rm -Rf "${CMAKE_SOURCE_DIR}/${CMAKE_BINARY_DIR}"
fi
if [[ "$1" == *"-ba"* || "--build-all" == "$1" ]];
then
build_local
build_interactive
elif [[ "$1" == *"-bi"* || "--build-interactive" == "$1" ]];
then
build_interactive
elif [[ "$1" == *"-bd"* || "--build-detached" == "$1" ]];
then
build_detached
elif [[ "$1" == *"-bl"* || "--build-local" == "$1" ]];
then
build_local
else
help_about
fi
A Docker ENTRYPOINT ["./entry-points/build.sh"] is used to implement the CMake commands to build hello-world-test project locally or via the provided docker service:
#!/usr/bin/env bash
#!/bin/bash
if [[ -e "./scripts/core.sh" ]];
then
source "./scripts/core.sh"
else
if [[ -e "../scripts/core.sh" ]];
then
source "../scripts/core.sh"
else
echo -e "\n${TAB}Unable to find bash scripts directory: '../scripts/core.sh'\n"
ls
#
# The following stops execution if the last command in the pipeline had an error.
# Since the core.sh library was not found the script most likely cannot continue
# without errors so the script process is aborted.
#
set -e
exit 0
fi
fi
function get_local_machine_settings()
{
RUN_VERBOSE="true"
. project-settings.sh
find_cmake_source_dir
validate_settings
}
# Acquire the root/main repo directory (i.e., where the root CMakeLists.txt is):
#
CMAKE_SOURCE_DIR=$(cd "$(dirname "$0")" && pwd)
if [[ "${CMAKE_SOURCE_DIR}" == *"entry-points"* ]];
then
# The following code acquires the root directory from the full path of
# the compiler-services directory (i.e., we are removing the substr 'entry-points').
#
remove_dir_from_path="/entry-points"
CMAKE_SOURCE_DIR="${CMAKE_SOURCE_DIR/$remove_dir_from_path}"
fi
# Specify the platform
#
if [[ ! -z "${OS_PLATFORM}" ]];
then
os_platform="${OS_PLATFORM}"
fi
echo -e "\n${IYellow}Building On: ${IBlue}${os_platform}${IDefault}\n"
if [[ "true" == "${LOCAL_MACHINE}" ]];
then
get_local_machine_settings
CMAKE_BUILD_DIR="${CMAKE_BINARY_DIR}/${os_platform}"
CMAKE_BINARY_DIR="${CMAKE_SOURCE_DIR}/${CMAKE_BINARY_DIR}/${os_platform}"
INSTALL_APPLICATION_PATH="${CMAKE_SOURCE_DIR}/${INSTALL_DIR}/${PROJECT_DIR_NAME}/${os_platform}"
# Target path will be the same on macOS and Linux
#
TARGET_PATH="${CMAKE_BINARY_DIR}/${REPO_SOURCE_DIR}/${PROJECT_DIR_NAME}/${PROJECT_NAME}"
# Visual Studio supports multiple configurations therefore supports Release/Debug (and perhaps others also).
# TODO: This is just a quick hack and a generic implementation should be demonstrated.
#
if [[ "${os_platform}" == *"windows"* ]];
then
TARGET_PATH="${CMAKE_SOURCE_DIR}/${CMAKE_BUILD_DIR}/${REPO_SOURCE_DIR}/${PROJECT_DIR_NAME}/Debug/${PROJECT_NAME}.exe"
fi
else
#
# Building from a docker container instance:
#
CMAKE_BINARY_DIR="${CMAKE_BINARY_DIR}/${os_platform}"
INSTALL_APPLICATION_PATH="${CMAKE_SOURCE_DIR}/${INSTALL_DIR}/${PROJECT_DIR_NAME}/${os_platform}/"
TARGET_PATH="${CMAKE_SOURCE_DIR}/${CMAKE_BINARY_DIR}/${REPO_SOURCE_DIR}/${PROJECT_DIR_NAME}/${PROJECT_NAME}"
fi
# Debug:
#echo "TARGET_PATH: ${TARGET_PATH}"
#echo "CMAKE_BUILD_DIR: ${CMAKE_BUILD_DIR}"
#echo "CMAKE_BINARY_DIR: ${CMAKE_BINARY_DIR}"
#echo "INSTALL_APPLICATION_PATH: ${INSTALL_APPLICATION_PATH}"
#set -e
#exit 0
cmake -S "${CMAKE_SOURCE_DIR}" -B "${CMAKE_BINARY_DIR}"
cmake --build "${CMAKE_BINARY_DIR}"
# Check the target on Windows .
# Make note of the comm
Selected from shared topics, language and repository description—not editorial ratings.
iciamyplant /
This is my final 42's project Minishell, I implemented my own shell in C, which supports redirections, pipes, environment variables and several builtins
64/100 healthJYEtech /
Source codes for DSO Shell (DSO150) from JYE Tech. They are not an exact copy of factory codes (e. g. product testing codes are not included) but have completely the same functions and performance of matching revision. The codes are built with support of the library file libdso150.a, which implements the core DSO functions and runs only on DSO Shell or equivalent boards. Source codes for library file libdso150.a are not included in this repository. This project was developed under CodeSourcery G++ Lite.
52/100 healthsanusanth /
What is Python? Executive Summary Python is an interpreted, object-oriented, high-level programming language with dynamic semantics. Its high-level built in data structures, combined with dynamic typing and dynamic binding, make it very attractive for Rapid Application Development, as well as for use as a scripting or glue language to connect existing components together. Python's simple, easy to learn syntax emphasizes readability and therefore reduces the cost of program maintenance. Python supports modules and packages, which encourages program modularity and code reuse. The Python interpreter and the extensive standard library are available in source or binary form without charge for all major platforms, and can be freely distributed. Often, programmers fall in love with Python because of the increased productivity it provides. Since there is no compilation step, the edit-test-debug cycle is incredibly fast. Debugging Python programs is easy: a bug or bad input will never cause a segmentation fault. Instead, when the interpreter discovers an error, it raises an exception. When the program doesn't catch the exception, the interpreter prints a stack trace. A source level debugger allows inspection of local and global variables, evaluation of arbitrary expressions, setting breakpoints, stepping through the code a line at a time, and so on. The debugger is written in Python itself, testifying to Python's introspective power. On the other hand, often the quickest way to debug a program is to add a few print statements to the source: the fast edit-test-debug cycle makes this simple approach very effective. What is Python? Python is a popular programming language. It was created by Guido van Rossum, and released in 1991. It is used for: web development (server-side), software development, mathematics, system scripting. What can Python do? Python can be used on a server to create web applications. Python can be used alongside software to create workflows. Python can connect to database systems. It can also read and modify files. Python can be used to handle big data and perform complex mathematics. Python can be used for rapid prototyping, or for production-ready software development. Why Python? Python works on different platforms (Windows, Mac, Linux, Raspberry Pi, etc). Python has a simple syntax similar to the English language. Python has syntax that allows developers to write programs with fewer lines than some other programming languages. Python runs on an interpreter system, meaning that code can be executed as soon as it is written. This means that prototyping can be very quick. Python can be treated in a procedural way, an object-oriented way or a functional way. Good to know The most recent major version of Python is Python 3, which we shall be using in this tutorial. However, Python 2, although not being updated with anything other than security updates, is still quite popular. In this tutorial Python will be written in a text editor. It is possible to write Python in an Integrated Development Environment, such as Thonny, Pycharm, Netbeans or Eclipse which are particularly useful when managing larger collections of Python files. Python Syntax compared to other programming languages Python was designed for readability, and has some similarities to the English language with influence from mathematics. Python uses new lines to complete a command, as opposed to other programming languages which often use semicolons or parentheses. Python relies on indentation, using whitespace, to define scope; such as the scope of loops, functions and classes. Other programming languages often use curly-brackets for this purpose. Applications for Python Python is used in many application domains. Here's a sampling. The Python Package Index lists thousands of third party modules for Python. Web and Internet Development Python offers many choices for web development: Frameworks such as Django and Pyramid. Micro-frameworks such as Flask and Bottle. Advanced content management systems such as Plone and django CMS. Python's standard library supports many Internet protocols: HTML and XML JSON E-mail processing. Support for FTP, IMAP, and other Internet protocols. Easy-to-use socket interface. And the Package Index has yet more libraries: Requests, a powerful HTTP client library. Beautiful Soup, an HTML parser that can handle all sorts of oddball HTML. Feedparser for parsing RSS/Atom feeds. Paramiko, implementing the SSH2 protocol. Twisted Python, a framework for asynchronous network programming. Scientific and Numeric Python is widely used in scientific and numeric computing: SciPy is a collection of packages for mathematics, science, and engineering. Pandas is a data analysis and modeling library. IPython is a powerful interactive shell that features easy editing and recording of a work session, and supports visualizations and parallel computing. The Software Carpentry Course teaches basic skills for scientific computing, running bootcamps and providing open-access teaching materials. Education Python is a superb language for teaching programming, both at the introductory level and in more advanced courses. Books such as How to Think Like a Computer Scientist, Python Programming: An Introduction to Computer Science, and Practical Programming. The Education Special Interest Group is a good place to discuss teaching issues. Desktop GUIs The Tk GUI library is included with most binary distributions of Python. Some toolkits that are usable on several platforms are available separately: wxWidgets Kivy, for writing multitouch applications. Qt via pyqt or pyside Platform-specific toolkits are also available: GTK+ Microsoft Foundation Classes through the win32 extensions Software Development Python is often used as a support language for software developers, for build control and management, testing, and in many other ways. SCons for build control. Buildbot and Apache Gump for automated continuous compilation and testing. Roundup or Trac for bug tracking and project management. Business Applications Python is also used to build ERP and e-commerce systems: Odoo is an all-in-one management software that offers a range of business applications that form a complete suite of enterprise management applications. Try ton is a three-tier high-level general purpose application platform.
rramatchandran /
# big-o-performance A simple html app to demonstrate performance costs of data structures. - Clone the project - Navigate to the root of the project in a termina or command prompt - Run 'npm install' - Run 'npm start' - Go to the URL specified in the terminal or command prompt to try out the app. # This app was created from the Create React App NPM. Below are instructions from that project. Below you will find some information on how to perform common tasks. You can find the most recent version of this guide [here](https://github.com/facebookincubator/create-react-app/blob/master/template/README.md). ## Table of Contents - [Updating to New Releases](#updating-to-new-releases) - [Sending Feedback](#sending-feedback) - [Folder Structure](#folder-structure) - [Available Scripts](#available-scripts) - [npm start](#npm-start) - [npm run build](#npm-run-build) - [npm run eject](#npm-run-eject) - [Displaying Lint Output in the Editor](#displaying-lint-output-in-the-editor) - [Installing a Dependency](#installing-a-dependency) - [Importing a Component](#importing-a-component) - [Adding a Stylesheet](#adding-a-stylesheet) - [Post-Processing CSS](#post-processing-css) - [Adding Images and Fonts](#adding-images-and-fonts) - [Adding Bootstrap](#adding-bootstrap) - [Adding Flow](#adding-flow) - [Adding Custom Environment Variables](#adding-custom-environment-variables) - [Integrating with a Node Backend](#integrating-with-a-node-backend) - [Proxying API Requests in Development](#proxying-api-requests-in-development) - [Deployment](#deployment) - [Now](#now) - [Heroku](#heroku) - [Surge](#surge) - [GitHub Pages](#github-pages) - [Something Missing?](#something-missing) ## Updating to New Releases Create React App is divided into two packages: * `create-react-app` is a global command-line utility that you use to create new projects. * `react-scripts` is a development dependency in the generated projects (including this one). You almost never need to update `create-react-app` itself: it’s delegates all the setup to `react-scripts`. When you run `create-react-app`, it always creates the project with the latest version of `react-scripts` so you’ll get all the new features and improvements in newly created apps automatically. To update an existing project to a new version of `react-scripts`, [open the changelog](https://github.com/facebookincubator/create-react-app/blob/master/CHANGELOG.md), find the version you’re currently on (check `package.json` in this folder if you’re not sure), and apply the migration instructions for the newer versions. In most cases bumping the `react-scripts` version in `package.json` and running `npm install` in this folder should be enough, but it’s good to consult the [changelog](https://github.com/facebookincubator/create-react-app/blob/master/CHANGELOG.md) for potential breaking changes. We commit to keeping the breaking changes minimal so you can upgrade `react-scripts` painlessly. ## Sending Feedback We are always open to [your feedback](https://github.com/facebookincubator/create-react-app/issues). ## Folder Structure After creation, your project should look like this: ``` my-app/ README.md index.html favicon.ico node_modules/ package.json src/ App.css App.js index.css index.js logo.svg ``` For the project to build, **these files must exist with exact filenames**: * `index.html` is the page template; * `favicon.ico` is the icon you see in the browser tab; * `src/index.js` is the JavaScript entry point. You can delete or rename the other files. You may create subdirectories inside `src`. For faster rebuilds, only files inside `src` are processed by Webpack. You need to **put any JS and CSS files inside `src`**, or Webpack won’t see them. You can, however, create more top-level directories. They will not be included in the production build so you can use them for things like documentation. ## Available Scripts In the project directory, you can run: ### `npm start` Runs the app in the development mode.<br> Open [http://localhost:3000](http://localhost:3000) to view it in the browser. The page will reload if you make edits.<br> You will also see any lint errors in the console. ### `npm run build` Builds the app for production to the `build` folder.<br> It correctly bundles React in production mode and optimizes the build for the best performance. The build is minified and the filenames include the hashes.<br> Your app is ready to be deployed! ### `npm run eject` **Note: this is a one-way operation. Once you `eject`, you can’t go back!** If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project. Instead, it will copy all the configuration files and the transitive dependencies (Webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own. You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it. ## Displaying Lint Output in the Editor >Note: this feature is available with `react-scripts@0.2.0` and higher. Some editors, including Sublime Text, Atom, and Visual Studio Code, provide plugins for ESLint. They are not required for linting. You should see the linter output right in your terminal as well as the browser console. However, if you prefer the lint results to appear right in your editor, there are some extra steps you can do. You would need to install an ESLint plugin for your editor first. >**A note for Atom `linter-eslint` users** >If you are using the Atom `linter-eslint` plugin, make sure that **Use global ESLint installation** option is checked: ><img src="http://i.imgur.com/yVNNHJM.png" width="300"> Then make sure `package.json` of your project ends with this block: ```js { // ... "eslintConfig": { "extends": "./node_modules/react-scripts/config/eslint.js" } } ``` Projects generated with `react-scripts@0.2.0` and higher should already have it. If you don’t need ESLint integration with your editor, you can safely delete those three lines from your `package.json`. Finally, you will need to install some packages *globally*: ```sh npm install -g eslint babel-eslint eslint-plugin-react eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-flowtype ``` We recognize that this is suboptimal, but it is currently required due to the way we hide the ESLint dependency. The ESLint team is already [working on a solution to this](https://github.com/eslint/eslint/issues/3458) so this may become unnecessary in a couple of months. ## Installing a Dependency The generated project includes React and ReactDOM as dependencies. It also includes a set of scripts used by Create React App as a development dependency. You may install other dependencies (for example, React Router) with `npm`: ``` npm install --save <library-name> ``` ## Importing a Component This project setup supports ES6 modules thanks to Babel. While you can still use `require()` and `module.exports`, we encourage you to use [`import` and `export`](http://exploringjs.com/es6/ch_modules.html) instead. For example: ### `Button.js` ```js import React, { Component } from 'react'; class Button extends Component { render() { // ... } } export default Button; // Don’t forget to use export default! ``` ### `DangerButton.js` ```js import React, { Component } from 'react'; import Button from './Button'; // Import a component from another file class DangerButton extends Component { render() { return <Button color="red" />; } } export default DangerButton; ``` Be aware of the [difference between default and named exports](http://stackoverflow.com/questions/36795819/react-native-es-6-when-should-i-use-curly-braces-for-import/36796281#36796281). It is a common source of mistakes. We suggest that you stick to using default imports and exports when a module only exports a single thing (for example, a component). That’s what you get when you use `export default Button` and `import Button from './Button'`. Named exports are useful for utility modules that export several functions. A module may have at most one default export and as many named exports as you like. Learn more about ES6 modules: * [When to use the curly braces?](http://stackoverflow.com/questions/36795819/react-native-es-6-when-should-i-use-curly-braces-for-import/36796281#36796281) * [Exploring ES6: Modules](http://exploringjs.com/es6/ch_modules.html) * [Understanding ES6: Modules](https://leanpub.com/understandinges6/read#leanpub-auto-encapsulating-code-with-modules) ## Adding a Stylesheet This project setup uses [Webpack](https://webpack.github.io/) for handling all assets. Webpack offers a custom way of “extending” the concept of `import` beyond JavaScript. To express that a JavaScript file depends on a CSS file, you need to **import the CSS from the JavaScript file**: ### `Button.css` ```css .Button { padding: 20px; } ``` ### `Button.js` ```js import React, { Component } from 'react'; import './Button.css'; // Tell Webpack that Button.js uses these styles class Button extends Component { render() { // You can use them as regular CSS styles return <div className="Button" />; } } ``` **This is not required for React** but many people find this feature convenient. You can read about the benefits of this approach [here](https://medium.com/seek-ui-engineering/block-element-modifying-your-javascript-components-d7f99fcab52b). However you should be aware that this makes your code less portable to other build tools and environments than Webpack. In development, expressing dependencies this way allows your styles to be reloaded on the fly as you edit them. In production, all CSS files will be concatenated into a single minified `.css` file in the build output. If you are concerned about using Webpack-specific semantics, you can put all your CSS right into `src/index.css`. It would still be imported from `src/index.js`, but you could always remove that import if you later migrate to a different build tool. ## Post-Processing CSS This project setup minifies your CSS and adds vendor prefixes to it automatically through [Autoprefixer](https://github.com/postcss/autoprefixer) so you don’t need to worry about it. For example, this: ```css .App { display: flex; flex-direction: row; align-items: center; } ``` becomes this: ```css .App { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } ``` There is currently no support for preprocessors such as Less, or for sharing variables across CSS files. ## Adding Images and Fonts With Webpack, using static assets like images and fonts works similarly to CSS. You can **`import` an image right in a JavaScript module**. This tells Webpack to include that image in the bundle. Unlike CSS imports, importing an image or a font gives you a string value. This value is the final image path you can reference in your code. Here is an example: ```js import React from 'react'; import logo from './logo.png'; // Tell Webpack this JS file uses this image console.log(logo); // /logo.84287d09.png function Header() { // Import result is the URL of your image return <img src={logo} alt="Logo" />; } export default function Header; ``` This works in CSS too: ```css .Logo { background-image: url(./logo.png); } ``` Webpack finds all relative module references in CSS (they start with `./`) and replaces them with the final paths from the compiled bundle. If you make a typo or accidentally delete an important file, you will see a compilation error, just like when you import a non-existent JavaScript module. The final filenames in the compiled bundle are generated by Webpack from content hashes. If the file content changes in the future, Webpack will give it a different name in production so you don’t need to worry about long-term caching of assets. Please be advised that this is also a custom feature of Webpack. **It is not required for React** but many people enjoy it (and React Native uses a similar mechanism for images). However it may not be portable to some other environments, such as Node.js and Browserify. If you prefer to reference static assets in a more traditional way outside the module system, please let us know [in this issue](https://github.com/facebookincubator/create-react-app/issues/28), and we will consider support for this. ## Adding Bootstrap You don’t have to use [React Bootstrap](https://react-bootstrap.github.io) together with React but it is a popular library for integrating Bootstrap with React apps. If you need it, you can integrate it with Create React App by following these steps: Install React Bootstrap and Bootstrap from NPM. React Bootstrap does not include Bootstrap CSS so this needs to be installed as well: ``` npm install react-bootstrap --save npm install bootstrap@3 --save ``` Import Bootstrap CSS and optionally Bootstrap theme CSS in the ```src/index.js``` file: ```js import 'bootstrap/dist/css/bootstrap.css'; import 'bootstrap/dist/css/bootstrap-theme.css'; ``` Import required React Bootstrap components within ```src/App.js``` file or your custom component files: ```js import { Navbar, Jumbotron, Button } from 'react-bootstrap'; ``` Now you are ready to use the imported React Bootstrap components within your component hierarchy defined in the render method. Here is an example [`App.js`](https://gist.githubusercontent.com/gaearon/85d8c067f6af1e56277c82d19fd4da7b/raw/6158dd991b67284e9fc8d70b9d973efe87659d72/App.js) redone using React Bootstrap. ## Adding Flow Flow typing is currently [not supported out of the box](https://github.com/facebookincubator/create-react-app/issues/72) with the default `.flowconfig` generated by Flow. If you run it, you might get errors like this: ```js node_modules/fbjs/lib/Deferred.js.flow:60 60: Promise.prototype.done.apply(this._promise, arguments); ^^^^ property `done`. Property not found in 495: declare class Promise<+R> { ^ Promise. See lib: /private/tmp/flow/flowlib_34952d31/core.js:495 node_modules/fbjs/lib/shallowEqual.js.flow:29 29: return x !== 0 || 1 / (x: $FlowIssue) === 1 / (y: $FlowIssue); ^^^^^^^^^^ identifier `$FlowIssue`. Could not resolve name src/App.js:3 3: import logo from './logo.svg'; ^^^^^^^^^^^^ ./logo.svg. Required module not found src/App.js:4 4: import './App.css'; ^^^^^^^^^^^ ./App.css. Required module not found src/index.js:5 5: import './index.css'; ^^^^^^^^^^^^^ ./index.css. Required module not found ``` To fix this, change your `.flowconfig` to look like this: ```ini [libs] ./node_modules/fbjs/flow/lib [options] esproposal.class_static_fields=enable esproposal.class_instance_fields=enable module.name_mapper='^\(.*\)\.css$' -> 'react-scripts/config/flow/css' module.name_mapper='^\(.*\)\.\(jpg\|png\|gif\|eot\|otf\|webp\|svg\|ttf\|woff\|woff2\|mp4\|webm\)$' -> 'react-scripts/config/flow/file' suppress_type=$FlowIssue suppress_type=$FlowFixMe ``` Re-run flow, and you shouldn’t get any extra issues. If you later `eject`, you’ll need to replace `react-scripts` references with the `<PROJECT_ROOT>` placeholder, for example: ```ini module.name_mapper='^\(.*\)\.css$' -> '<PROJECT_ROOT>/config/flow/css' module.name_mapper='^\(.*\)\.\(jpg\|png\|gif\|eot\|otf\|webp\|svg\|ttf\|woff\|woff2\|mp4\|webm\)$' -> '<PROJECT_ROOT>/config/flow/file' ``` We will consider integrating more tightly with Flow in the future so that you don’t have to do this. ## Adding Custom Environment Variables >Note: this feature is available with `react-scripts@0.2.3` and higher. Your project can consume variables declared in your environment as if they were declared locally in your JS files. By default you will have `NODE_ENV` defined for you, and any other environment variables starting with `REACT_APP_`. These environment variables will be defined for you on `process.env`. For example, having an environment variable named `REACT_APP_SECRET_CODE` will be exposed in your JS as `process.env.REACT_APP_SECRET_CODE`, in addition to `process.env.NODE_ENV`. These environment variables can be useful for displaying information conditionally based on where the project is deployed or consuming sensitive data that lives outside of version control. First, you need to have environment variables defined, which can vary between OSes. For example, let's say you wanted to consume a secret defined in the environment inside a `<form>`: ```jsx render() { return ( <div> <small>You are running this application in <b>{process.env.NODE_ENV}</b> mode.</small> <form> <input type="hidden" defaultValue={process.env.REACT_APP_SECRET_CODE} /> </form> </div> ); } ``` The above form is looking for a variable called `REACT_APP_SECRET_CODE` from the environment. In order to consume this value, we need to have it defined in the environment: ### Windows (cmd.exe) ```cmd set REACT_APP_SECRET_CODE=abcdef&&npm start ``` (Note: the lack of whitespace is intentional.) ### Linux, OS X (Bash) ```bash REACT_APP_SECRET_CODE=abcdef npm start ``` > Note: Defining environment variables in this manner is temporary for the life of the shell session. Setting permanent environment variables is outside the scope of these docs. With our environment variable defined, we start the app and consume the values. Remember that the `NODE_ENV` variable will be set for you automatically. When you load the app in the browser and inspect the `<input>`, you will see its value set to `abcdef`, and the bold text will show the environment provided when using `npm start`: ```html <div> <small>You are running this application in <b>development</b> mode.</small> <form> <input type="hidden" value="abcdef" /> </form> </div> ``` Having access to the `NODE_ENV` is also useful for performing actions conditionally: ```js if (process.env.NODE_ENV !== 'production') { analytics.disable(); } ``` ## Integrating with a Node Backend Check out [this tutorial](https://www.fullstackreact.com/articles/using-create-react-app-with-a-server/) for instructions on integrating an app with a Node backend running on another port, and using `fetch()` to access it. You can find the companion GitHub repository [here](https://github.com/fullstackreact/food-lookup-demo). ## Proxying API Requests in Development >Note: this feature is available with `react-scripts@0.2.3` and higher. People often serve the front-end React app from the same host and port as their backend implementation. For example, a production setup might look like this after the app is deployed: ``` / - static server returns index.html with React app /todos - static server returns index.html with React app /api/todos - server handles any /api/* requests using the backend implementation ``` Such setup is **not** required. However, if you **do** have a setup like this, it is convenient to write requests like `fetch('/api/todos')` without worrying about redirecting them to another host or port during development. To tell the development server to proxy any unknown requests to your API server in development, add a `proxy` field to your `package.json`, for example: ```js "proxy": "http://localhost:4000", ``` This way, when you `fetch('/api/todos')` in development, the development server will recognize that it’s not a static asset, and will proxy your request to `http://localhost:4000/api/todos` as a fallback. Conveniently, this avoids [CORS issues](http://stackoverflow.com/questions/21854516/understanding-ajax-cors-and-security-considerations) and error messages like this in development: ``` Fetch API cannot load http://localhost:4000/api/todos. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled. ``` Keep in mind that `proxy` only has effect in development (with `npm start`), and it is up to you to ensure that URLs like `/api/todos` point to the right thing in production. You don’t have to use the `/api` prefix. Any unrecognized request will be redirected to the specified `proxy`. Currently the `proxy` option only handles HTTP requests, and it won’t proxy WebSocket connections. If the `proxy` option is **not** flexible enough for you, alternatively you can: * Enable CORS on your server ([here’s how to do it for Express](http://enable-cors.org/server_expressjs.html)). * Use [environment variables](#adding-custom-environment-variables) to inject the right server host and port into your app. ## Deployment By default, Create React App produces a build assuming your app is hosted at the server root. To override this, specify the `homepage` in your `package.json`, for example: ```js "homepage": "http://mywebsite.com/relativepath", ``` This will let Create React App correctly infer the root path to use in the generated HTML file. ### Now See [this example](https://github.com/xkawi/create-react-app-now) for a zero-configuration single-command deployment with [now](https://zeit.co/now). ### Heroku Use the [Heroku Buildpack for Create React App](https://github.com/mars/create-react-app-buildpack). You can find instructions in [Deploying React with Zero Configuration](https://blog.heroku.com/deploying-react-with-zero-configuration). ### Surge Install the Surge CLI if you haven't already by running `npm install -g surge`. Run the `surge` command and log in you or create a new account. You just need to specify the *build* folder and your custom domain, and you are done. ```sh email: email@domain.com password: ******** project path: /path/to/project/build size: 7 files, 1.8 MB domain: create-react-app.surge.sh upload: [====================] 100%, eta: 0.0s propagate on CDN: [====================] 100% plan: Free users: email@domain.com IP Address: X.X.X.X Success! Project is published and running at create-react-app.surge.sh ``` Note that in order to support routers that use html5 `pushState` API, you may want to rename the `index.html` in your build folder to `200.html` before deploying to Surge. This [ensures that every URL falls back to that file](https://surge.sh/help/adding-a-200-page-for-client-side-routing). ### GitHub Pages >Note: this feature is available with `react-scripts@0.2.0` and higher. Open your `package.json` and add a `homepage` field: ```js "homepage": "http://myusername.github.io/my-app", ``` **The above step is important!** Create React App uses the `homepage` field to determine the root URL in the built HTML file. Now, whenever you run `npm run build`, you will see a cheat sheet with a sequence of commands to deploy to GitHub pages: ```sh git commit -am "Save local changes" git checkout -B gh-pages git add -f build git commit -am "Rebuild website" git filter-branch -f --prune-empty --subdirectory-filter build git push -f origin gh-pages git checkout - ``` You may copy and paste them, or put them into a custom shell script. You may also customize them for another hosting provider. Note that GitHub Pages doesn't support routers that use the HTML5 `pushState` history API under the hood (for example, React Router using `browserHistory`). This is because when there is a fresh page load for a url like `http://user.github.io/todomvc/todos/42`, where `/todos/42` is a frontend route, the GitHub Pages server returns 404 because it knows nothing of `/todos/42`. If you want to add a router to a project hosted on GitHub Pages, here are a couple of solutions: * You could switch from using HTML5 history API to routing with hashes. If you use React Router, you can switch to `hashHistory` for this effect, but the URL will be longer and more verbose (for example, `http://user.github.io/todomvc/#/todos/42?_k=yknaj`). [Read more](https://github.com/reactjs/react-router/blob/master/docs/guides/Histories.md#histories) about different history implementations in React Router. * Alternatively, you can use a trick to teach GitHub Pages to handle 404 by redirecting to your `index.html` page with a special redirect parameter. You would need to add a `404.html` file with the redirection code to the `build` folder before deploying your project, and you’ll need to add code handling the redirect parameter to `index.html`. You can find a detailed explanation of this technique [in this guide](https://github.com/rafrex/spa-github-pages). ## Something Missing? If you have ideas for more “How To” recipes that should be on this page, [let us know](https://github.com/facebookincubator/create-react-app/issues) or [contribute some!](https://github.com/facebookincubator/create-react-app/edit/master/template/README.md)
61/100 healthivangfr /
The goal of this project is to play with Spring WebFlux on client and server side. For it, we will implement some Spring Boot Java Web applications, product-api, customer-api, order-api and client-shell, and use reactive NoSQL database like Cassandra, MongoDB, Postgres and MySQL.
53/100 healthginking /
Archimedes 1 is a bot based sentient based trader, heavily influenced on forked existing bots, with a few enhancements here or there, this was completed to understand how the bots worked to roll the forward in our own manner to our own complete ai based trading system (Archimedes 2:0) This bot watches [followed accounts] tweets and waits for them to mention any publicly traded companies. When they do, sentiment analysis is used determine whether the opinions are positive or negative toward those companies. The bot then automatically executes trades on the relevant stocks according to the expected market reaction. The code is written in Python and is meant to run on a Google Compute Engine instance. It uses the Twitter Streaming APIs (however new version) to get notified whenever tweets within remit are of interest. The entity detection and sentiment analysis is done using Google's Cloud Natural Language API and the Wikidata Query Service provides the company data. The TradeKing (ALLY) API does the stock trading (changed to ALLY). The main module defines a callback where incoming tweets are handled and starts streaming user's feed: def twitter_callback(tweet): companies = analysis.find_companies(tweet) if companies: trading.make_trades(companies) twitter.tweet(companies, tweet) if __name__ == "__main__": twitter.start_streaming(twitter_callback) The core algorithms are implemented in the analysis and trading modules. The former finds mentions of companies in the text of the tweet, figures out what their ticker symbol is, and assigns a sentiment score to them. The latter chooses a trading strategy, which is either buy now and sell at close or sell short now and buy to cover at close. The twitter module deals with streaming and tweeting out the summary. Follow these steps to run the code yourself: 1. Create VM instance Check out the quickstart to create a Cloud Platform project and a Linux VM instance with Compute Engine, then SSH into it for the steps below. The predefined machine type g1-small (1 vCPU, 1.7 GB memory) seems to work well. 2. Set up auth The authentication keys for the different APIs are read from shell environment variables. Each service has different steps to obtain them. Twitter Log in to your Twitter account and create a new application. Under the Keys and Access Tokens tab for your app you'll find the Consumer Key and Consumer Secret. Export both to environment variables: export TWITTER_CONSUMER_KEY="<YOUR_CONSUMER_KEY>" export TWITTER_CONSUMER_SECRET="<YOUR_CONSUMER_SECRET>" If you want the tweets to come from the same account that owns the application, simply use the Access Token and Access Token Secret on the same page. If you want to tweet from a different account, follow the steps to obtain an access token. Then export both to environment variables: export TWITTER_ACCESS_TOKEN="<YOUR_ACCESS_TOKEN>" export TWITTER_ACCESS_TOKEN_SECRET="<YOUR_ACCESS_TOKEN_SECRET>" Google Follow the Google Application Default Credentials instructions to create, download, and export a service account key. export GOOGLE_APPLICATION_CREDENTIALS="/path/to/credentials-file.json" You also need to enable the Cloud Natural Language API for your Google Cloud Platform project. TradeKing (ALLY) Log in to your TradeKing (ALLY account and create a new application. Behind the Details button for your application you'll find the Consumer Key, Consumer Secret, OAuth (Access) Token, and Oauth (Access) Token Secret. Export them all to environment variables: export TRADEKING_CONSUMER_KEY="<YOUR_CONSUMER_KEY>" export TRADEKING_CONSUMER_SECRET="<YOUR_CONSUMER_SECRET>" export TRADEKING_ACCESS_TOKEN="<YOUR_ACCESS_TOKEN>" export TRADEKING_ACCESS_TOKEN_SECRET="<YOUR_ACCESS_TOKEN_SECRET>" Also export your TradeKing (ALLY) account number, which you'll find under My Accounts: export TRADEKING_ACCOUNT_NUMBER="<YOUR_ACCOUNT_NUMBER>" 3. Install dependencies There are a few library dependencies, which you can install using pip: $ pip install -r requirements.txt 4. Run the tests Verify that everything is working as intended by running the tests with pytest using this command: $ export USE_REAL_MONEY=NO && pytest *.py --verbose 5. Run the benchmark The benchmark report shows how the current implementation of the analysis and trading algorithms would have performed against historical data. You can run it again to benchmark any changes you may have made: $ ./benchmark.py > benchmark.md 6. Start the bot Enable real orders that use your money: $ export USE_REAL_MONEY=YES Have the code start running in the background with this command: $ nohup ./main.py & License Archimedes (edits under Invacio) Max Braun Frame under Max Braun, licence under Apache V2 License. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0 Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
56/100 health