diff --git a/src/components/EditFieldForm/EditFieldDate.tsx b/src/components/EditFieldForm/EditFieldDate.tsx
index f79564f..f8e928f 100644
--- a/src/components/EditFieldForm/EditFieldDate.tsx
+++ b/src/components/EditFieldForm/EditFieldDate.tsx
@@ -3,6 +3,8 @@ import { Accordion } from "react-bootstrap";
 import { TypeOptionSelect } from "./TypeOptionSelect";
 import { FormikProps } from "formik";
 
+export const DARTE_FIELD_OPTIONS = "Date Field Options";
+
 export interface EditFieldTextProps
   extends FormikProps<{ [key: string]: string }> {}
 
@@ -13,7 +15,7 @@ export const EditFieldDate: FC<EditFieldTextProps> = (props): ReactElement => {
       <Accordion flush className="form__modal_accordion">
         <Accordion.Item eventKey="0">
           <Accordion.Header>
-            <h5>Date Field Options</h5>
+            <h5>{DARTE_FIELD_OPTIONS}</h5>
           </Accordion.Header>
           <Accordion.Body>
             <TypeOptionSelect {...props} />
diff --git a/src/components/EditFieldForm/EditFieldForm.tsx b/src/components/EditFieldForm/EditFieldForm.tsx
index 3d3459d..cbf9d5b 100644
--- a/src/components/EditFieldForm/EditFieldForm.tsx
+++ b/src/components/EditFieldForm/EditFieldForm.tsx
@@ -17,6 +17,42 @@ import { EditFieldNumber } from "./EditFieldNumber";
 import { EditFieldDate } from "./EditFieldDate";
 import "./editFieldForm.scss";
 import { EditFieldSelect } from "./EditFieldSelect";
+import {
+  ADD,
+  BOOLEAN,
+  BOOLEAN_LABEL,
+  CANCEL,
+  CREATE_LABEL,
+  DATE,
+  DATE_LABEL,
+  FIELD,
+  NUMBER,
+  NUMBER_LABEL,
+  PRIMARY,
+  REQUIRED_LABEL,
+  RESET,
+  SECONDARY,
+  SELECT,
+  SELECT_LABEL,
+  SUBMIT,
+  SWITCH,
+  TEXT,
+  TEXT_DANGER,
+  TEXT_LABEL,
+  TEXT_MUTED,
+  TYPE,
+  UPDATE_LABEL,
+} from "../../strings";
+
+export const NAME = "name";
+export const REQUIRED = "required";
+
+export const FIELD_NAME_LABEL = "Field Name";
+export const FIELD_NAME_PLACEHOLDER = "Enter field name";
+export const FIELD_NAME_HELP_TEXT = "What is the name of this field?";
+export const FIELD_TYPE_LABEL = "Field Type";
+export const FIELD_TYPE_HELP_TEXT = "What type of field is this?";
+export const FIELD_REQUIRED_HELP_TEXT = "Is this field required?";
 
 export interface HandleFieldsFunction {
   (values: { [key: string]: string }, log: Log, field: LogFields): void;
@@ -70,11 +106,11 @@ export const EditFieldForm: FC<EditFieldFormProps> = ({
         ...fieldState,
       }}
       validationSchema={Yup.object({
-        name: Yup.string().required("Required"),
-        type: Yup.string().required("Required"),
-        option: Yup.string().when("type", {
-          is: "select",
-          then: Yup.string().required("Required"),
+        name: Yup.string().required(REQUIRED_LABEL),
+        type: Yup.string().required(REQUIRED_LABEL),
+        option: Yup.string().when(TYPE, {
+          is: SELECT,
+          then: Yup.string().required(REQUIRED_LABEL),
         }),
       })}
       onSubmit={(values: { [key: string]: string }) => {
@@ -96,30 +132,30 @@ export const EditFieldForm: FC<EditFieldFormProps> = ({
           <Form onSubmit={handleSubmit} className="form__field_edit">
             {/* Name, Type, and Required inputs */}
             <Form.Group>
-              <Form.Label>Field Name</Form.Label>
+              <Form.Label>{FIELD_NAME_LABEL}</Form.Label>
               <Form.Control
-                type="text"
-                name="name"
-                placeholder="Enter field name"
+                type={TEXT}
+                name={NAME}
+                placeholder={FIELD_NAME_PLACEHOLDER}
                 onChange={handleChange}
                 onBlur={handleBlur}
                 value={values.name}
               />
               {(touched.name && errors.name && (
-                <Form.Text className="text-danger">{errors.name}</Form.Text>
+                <Form.Text className={TEXT_DANGER}>{errors.name}</Form.Text>
               )) || (
-                <Form.Text className="text-muted">
-                  This is the name of the field
+                <Form.Text className={TEXT_MUTED}>
+                  {FIELD_NAME_HELP_TEXT}
                 </Form.Text>
               )}
             </Form.Group>
             <Form.Group>
               <Row>
                 <Col>
-                  <Form.Label>Field Type</Form.Label>
+                  <Form.Label>{FIELD_TYPE_LABEL}</Form.Label>
                   <Form.Control
-                    as="select"
-                    name="type"
+                    as={SELECT}
+                    name={TYPE}
                     onChange={(e) => {
                       handleChange(e);
                       const prevValues = { ...values };
@@ -140,51 +176,51 @@ export const EditFieldForm: FC<EditFieldFormProps> = ({
                     onBlur={handleBlur}
                     value={values.type}
                   >
-                    <option value="text">Text</option>
-                    <option value="number">Number</option>
-                    <option value="date">Date</option>
-                    <option value="select">Selection</option>
+                    <option value={TEXT}>{TEXT_LABEL}</option>
+                    <option value={NUMBER}>{NUMBER_LABEL}</option>
+                    <option value={DATE}>{DATE_LABEL}</option>
+                    <option value={SELECT}>{SELECT_LABEL}</option>
                     {/* <option value="tags">Tags</option> */}
-                    <option value="boolean">Boolean</option>
+                    <option value={BOOLEAN}>{BOOLEAN_LABEL}</option>
                   </Form.Control>
                   {(touched.type && errors.type && (
-                    <Form.Text className="text-danger">{errors.type}</Form.Text>
+                    <Form.Text className={TEXT_DANGER}>{errors.type}</Form.Text>
                   )) || (
-                    <Form.Text className="text-muted">
-                      This is the type of the field.
+                    <Form.Text className={TEXT_MUTED}>
+                      {FIELD_TYPE_HELP_TEXT}
                     </Form.Text>
                   )}
                 </Col>
                 <Col>
-                  <Form.Label>Required</Form.Label>
+                  <Form.Label>{REQUIRED_LABEL}</Form.Label>
                   <Form.Check
-                    type="switch"
-                    name="required"
+                    type={SWITCH}
+                    name={REQUIRED}
                     className="form__field_edit__required"
                     onChange={handleChange}
                     onBlur={handleBlur}
                     defaultChecked={values.required as unknown as boolean}
                   />
                   {(touched.required && errors.required && (
-                    <Form.Text className="text-danger">
+                    <Form.Text className={TEXT_DANGER}>
                       {errors.required}
                     </Form.Text>
                   )) || (
-                    <Form.Text className="text-muted">
-                      Is this field required?
+                    <Form.Text className={TEXT_MUTED}>
+                      {FIELD_REQUIRED_HELP_TEXT}
                     </Form.Text>
                   )}
                 </Col>
               </Row>
             </Form.Group>
 
-            {values.type === "text" && <EditFieldText {...props} />}
+            {values.type === TEXT && <EditFieldText {...props} />}
 
-            {values.type === "number" && <EditFieldNumber {...props} />}
+            {values.type === NUMBER && <EditFieldNumber {...props} />}
 
-            {values.type === "date" && <EditFieldDate {...props} />}
+            {values.type === DATE && <EditFieldDate {...props} />}
 
-            {values.type === "select" && <EditFieldSelect {...props} />}
+            {values.type === SELECT && <EditFieldSelect {...props} />}
 
             <hr />
             {/* Cancel and Submit Buttons */}
@@ -192,19 +228,21 @@ export const EditFieldForm: FC<EditFieldFormProps> = ({
               <Row className="form__field_edit__submit_row">
                 <Col>
                   <Button
-                    variant="secondary"
-                    type="reset"
+                    variant={SECONDARY}
+                    type={RESET}
                     onClick={(e) => {
                       e.preventDefault();
                       resetModal();
                     }}
                   >
-                    Cancel
+                    {CANCEL}
                   </Button>
                 </Col>
                 <Col>
-                  <Button variant="primary" type="submit">
-                    {`${modalMode === "add" ? "Create" : "Update"} Field`}
+                  <Button variant={PRIMARY} type={SUBMIT}>
+                    {`${
+                      modalMode === ADD ? CREATE_LABEL : UPDATE_LABEL
+                    } ${FIELD}`}
                   </Button>
                 </Col>
               </Row>
diff --git a/src/components/EditFieldForm/EditFieldNumber.tsx b/src/components/EditFieldForm/EditFieldNumber.tsx
index a8e7908..90a94d0 100644
--- a/src/components/EditFieldForm/EditFieldNumber.tsx
+++ b/src/components/EditFieldForm/EditFieldNumber.tsx
@@ -2,6 +2,28 @@ import React, { FC, ReactElement } from "react";
 import { Accordion, Col, Form, Row } from "react-bootstrap";
 import { FormikProps } from "formik";
 import { TypeOptionSelect } from "./TypeOptionSelect";
+import {
+  DEFAULT,
+  MAX,
+  MIN,
+  NONE_LABEL,
+  NUMBER,
+  STEP,
+  STEPS_LABEL,
+  TEXT,
+  TEXT_DANGER,
+  TEXT_MUTED,
+} from "../../strings";
+
+export const NUMBER_FIELD_OPTIONS = "Number Field Options";
+export const MIN_VALUE = "Min Value";
+export const MAX_VALUE = "Max Value";
+export const UNIT = "unit";
+export const UNIT_LABEL = "Unit";
+export const UNIT_PLACEHOLDER = "Degrees, meters, etc.";
+export const DEFAULT_VALUE = "defaultValue";
+export const DEFAULT_VALUE_LABEL = "Default Value";
+export const DEFAULT_VALUE_TEXT = "This is the default value of the field";
 
 export interface EditFieldTextProps
   extends FormikProps<{ [key: string]: string }> {}
@@ -17,7 +39,7 @@ export const EditFieldNumber: FC<EditFieldTextProps> = (
       <Accordion flush className="form__modal_accordion">
         <Accordion.Item eventKey="0">
           <Accordion.Header>
-            <h5>Number Field Options</h5>
+            <h5>{NUMBER_FIELD_OPTIONS}</h5>
           </Accordion.Header>
           <Accordion.Body>
             <TypeOptionSelect {...formikProps} />
@@ -25,36 +47,36 @@ export const EditFieldNumber: FC<EditFieldTextProps> = (
             <Form.Group>
               <Row>
                 <Col>
-                  <Form.Label>{"Min Value"}</Form.Label>
+                  <Form.Label>{MIN_VALUE}</Form.Label>
                   <Form.Control
-                    type="number"
-                    name="min"
-                    placeholder="Min"
+                    type={NUMBER}
+                    name={MIN}
                     onChange={handleChange}
                     onBlur={handleBlur}
                     value={values.min}
                   />
                   {(touched.min && errors.min && (
-                    <Form.Text className="text-danger">{errors.min}</Form.Text>
+                    <Form.Text className={TEXT_DANGER}>{errors.min}</Form.Text>
                   )) || (
-                    <Form.Text className="text-muted">{"Default: 0"}</Form.Text>
+                    <Form.Text
+                      className={TEXT_MUTED}
+                    >{`${DEFAULT}0`}</Form.Text>
                   )}
                 </Col>
                 <Col>
-                  <Form.Label>{"Max Value"}</Form.Label>
+                  <Form.Label>{MAX_VALUE}</Form.Label>
                   <Form.Control
-                    type="number"
-                    name="max"
-                    placeholder="Max"
+                    type={NUMBER}
+                    name={MAX}
                     onChange={handleChange}
                     onBlur={handleBlur}
                     value={values.max}
                   />
                   {(touched.max && errors.max && (
-                    <Form.Text className="text-danger">{errors.max}</Form.Text>
+                    <Form.Text className={TEXT_DANGER}>{errors.max}</Form.Text>
                   )) || (
-                    <Form.Text className="text-muted">
-                      {"Default: 100"}
+                    <Form.Text className={TEXT_MUTED}>
+                      {`${DEFAULT}100`}
                     </Form.Text>
                   )}
                 </Col>
@@ -64,36 +86,37 @@ export const EditFieldNumber: FC<EditFieldTextProps> = (
             <Form.Group>
               <Row>
                 <Col>
-                  <Form.Label>{"Steps"}</Form.Label>
+                  <Form.Label>{STEPS_LABEL}</Form.Label>
                   <Form.Control
-                    type="number"
-                    name="step"
-                    placeholder="Steps"
+                    type={NUMBER}
+                    name={STEP}
                     onChange={handleChange}
                     onBlur={handleBlur}
                     value={values.step}
                   />
                   {(touched.step && errors.step && (
-                    <Form.Text className="text-danger">{errors.step}</Form.Text>
+                    <Form.Text className={TEXT_DANGER}>{errors.step}</Form.Text>
                   )) || (
-                    <Form.Text className="text-muted">{"Default: 1"}</Form.Text>
+                    <Form.Text
+                      className={TEXT_MUTED}
+                    >{`${DEFAULT}1`}</Form.Text>
                   )}
                 </Col>
                 <Col>
-                  <Form.Label>{"Unit"}</Form.Label>
+                  <Form.Label>{UNIT_LABEL}</Form.Label>
                   <Form.Control
-                    type="text"
-                    name="unit"
-                    placeholder="Degrees, meters, etc."
+                    type={TEXT}
+                    name={UNIT}
+                    placeholder={UNIT_PLACEHOLDER}
                     onChange={handleChange}
                     onBlur={handleBlur}
                     value={values.unit}
                   />
                   {(touched.unit && errors.unit && (
-                    <Form.Text className="text-danger">{errors.unit}</Form.Text>
+                    <Form.Text className={TEXT_DANGER}>{errors.unit}</Form.Text>
                   )) || (
-                    <Form.Text className="text-muted">
-                      {"Default: None"}
+                    <Form.Text className={TEXT_MUTED}>
+                      {`${DEFAULT}${NONE_LABEL}`}
                     </Form.Text>
                   )}
                 </Col>
@@ -101,22 +124,21 @@ export const EditFieldNumber: FC<EditFieldTextProps> = (
             </Form.Group>
 
             <Form.Group>
-              <Form.Label>{"Default Value"}</Form.Label>
+              <Form.Label>{DEFAULT_VALUE_LABEL}</Form.Label>
               <Form.Control
-                type="number"
-                name="defaultValue"
-                placeholder="Enter the default number for this field"
+                type={NUMBER}
+                name={DEFAULT_VALUE}
                 onChange={handleChange}
                 onBlur={handleBlur}
                 value={values.defaultValue}
               />
               {(touched.defaultValue && errors.defaultValue && (
-                <Form.Text className="text-danger">
+                <Form.Text className={TEXT_DANGER}>
                   {errors.defaultValue}
                 </Form.Text>
               )) || (
-                <Form.Text className="text-muted">
-                  {"This is the default value of the field"}
+                <Form.Text className={TEXT_MUTED}>
+                  {DEFAULT_VALUE_TEXT}
                 </Form.Text>
               )}
             </Form.Group>
diff --git a/src/components/EditFieldForm/EditFieldSelect.tsx b/src/components/EditFieldForm/EditFieldSelect.tsx
index 9f3aa6b..8a19a56 100644
--- a/src/components/EditFieldForm/EditFieldSelect.tsx
+++ b/src/components/EditFieldForm/EditFieldSelect.tsx
@@ -2,10 +2,21 @@ import React, { FC, ReactElement } from "react";
 import { Accordion, Col, Form, Row } from "react-bootstrap";
 import { FormikProps } from "formik";
 import { TypeOptionSelect } from "./TypeOptionSelect";
+import { TEXTAREA, TEXT_DANGER, TEXT_MUTED } from "../../strings";
 
-export interface EditFieldSelectProps extends FormikProps<{ [key: string]: string }> {}
+export const OPTIONS = "options";
 
-export const EditFieldSelect: FC<EditFieldSelectProps> = (formikProps): ReactElement => {
+export const SELECT_FIELD_OPTIONS = "Select Field Options";
+export const SELECT_OPTIONS = "Select Options";
+export const OPTIONS_PLACEHOLDER = "Option1, Option2, Option3";
+export const OPTIONS_LABEL = "Enter options separated by commas";
+
+export interface EditFieldSelectProps
+  extends FormikProps<{ [key: string]: string }> {}
+
+export const EditFieldSelect: FC<EditFieldSelectProps> = (
+  formikProps
+): ReactElement => {
   const { values, errors, touched, handleChange, handleBlur } = formikProps;
 
   return (
@@ -14,7 +25,7 @@ export const EditFieldSelect: FC<EditFieldSelectProps> = (formikProps): ReactEle
       <Accordion flush className="form__modal_accordion">
         <Accordion.Item eventKey="0">
           <Accordion.Header>
-            <h5>Select Field Options</h5>
+            <h5>{SELECT_FIELD_OPTIONS}</h5>
           </Accordion.Header>
           <Accordion.Body>
             <TypeOptionSelect {...formikProps} />
@@ -22,21 +33,23 @@ export const EditFieldSelect: FC<EditFieldSelectProps> = (formikProps): ReactEle
             <Form.Group>
               <Row>
                 <Col>
-                  <Form.Label>{"Select Options"}</Form.Label>
+                  <Form.Label>{SELECT_OPTIONS}</Form.Label>
                   <Form.Control
-                    as="textarea"
+                    as={TEXTAREA}
                     rows={3}
-                    name="options"
-                    placeholder="Option1, Option2, Option3"
+                    name={OPTIONS}
+                    placeholder={OPTIONS_PLACEHOLDER}
                     onChange={handleChange}
                     onBlur={handleBlur}
                     value={values.options}
                   />
                   {(touched.option && errors.option && (
-                    <Form.Text className="text-danger">{errors.option}</Form.Text>
+                    <Form.Text className={TEXT_DANGER}>
+                      {errors.option}
+                    </Form.Text>
                   )) || (
-                    <Form.Text className="text-muted">
-                      {"Enter options separated by commas"}
+                    <Form.Text className={TEXT_MUTED}>
+                      {OPTIONS_LABEL}
                     </Form.Text>
                   )}
                 </Col>
@@ -47,4 +60,4 @@ export const EditFieldSelect: FC<EditFieldSelectProps> = (formikProps): ReactEle
       </Accordion>
     </>
   );
-}
\ No newline at end of file
+};
diff --git a/src/components/EditFieldForm/EditFieldText.tsx b/src/components/EditFieldForm/EditFieldText.tsx
index abc0da2..701ac3f 100644
--- a/src/components/EditFieldForm/EditFieldText.tsx
+++ b/src/components/EditFieldForm/EditFieldText.tsx
@@ -2,6 +2,26 @@ import React, { FC, ReactElement } from "react";
 import { Accordion, Col, Form, Row } from "react-bootstrap";
 import { TypeOptionSelect } from "./TypeOptionSelect";
 import { FormikProps } from "formik";
+import {
+  NUMBER,
+  MAX,
+  MIN,
+  DEFAULT,
+  NONE_LABEL,
+  NONE,
+  TEXT,
+  TEXT_DANGER,
+  TEXT_MUTED,
+} from "../../strings";
+
+export const TEXT_FIELD_OPTIONS = "Text Field Options";
+export const MIN_LENGTH = "Min Length";
+export const MAX_LENGTH = "Max Length";
+export const DEFAULT_VALUE = "defaultValue";
+export const DEFAULT_VALUE_LABEL = "Default Value";
+export const DEFAULT_TEXT_VALUE_PLACEHOLDER =
+  "Enter the default text for this field";
+export const DEFAULT_TEXT_LABEL = "This is the default value of the field";
 
 export interface EditFieldTextProps
   extends FormikProps<{ [key: string]: string }> {}
@@ -14,42 +34,44 @@ export const EditFieldText: FC<EditFieldTextProps> = (props): ReactElement => {
       <Accordion flush className="form__modal_accordion">
         <Accordion.Item eventKey="0">
           <Accordion.Header>
-            <h5>Text Field Options</h5>
+            <h5>{TEXT_FIELD_OPTIONS}</h5>
           </Accordion.Header>
           <Accordion.Body>
             <TypeOptionSelect {...props} />
             <Form.Group>
               <Row>
                 <Col>
-                  <Form.Label>{"Min Length"}</Form.Label>
+                  <Form.Label>{MIN_LENGTH}</Form.Label>
                   <Form.Control
-                    type="number"
-                    name="min"
-                    placeholder={values.min || "None"}
+                    type={NUMBER}
+                    name={MIN}
+                    placeholder={values.min || NONE_LABEL}
                     onChange={handleChange}
                     onBlur={handleBlur}
                     value={values.min}
                   />
                   {(touched.min && errors.min && (
-                    <Form.Text className="text-danger">{errors.min}</Form.Text>
+                    <Form.Text className={TEXT_DANGER}>{errors.min}</Form.Text>
                   )) || (
-                    <Form.Text className="text-muted">{"Default: 0"}</Form.Text>
+                    <Form.Text
+                      className={TEXT_MUTED}
+                    >{`${DEFAULT}0`}</Form.Text>
                   )}
                 </Col>
                 <Col>
-                  <Form.Label>{"Max Length"}</Form.Label>
+                  <Form.Label>{MAX_LENGTH}</Form.Label>
                   <Form.Control
-                    type="number"
-                    name="max"
+                    type={NUMBER}
+                    name={MAX}
                     onChange={handleChange}
                     onBlur={handleBlur}
                     value={values.max}
                   />
                   {(touched.max && errors.max && (
-                    <Form.Text className="text-danger">{errors.max}</Form.Text>
+                    <Form.Text className={TEXT_DANGER}>{errors.max}</Form.Text>
                   )) || (
-                    <Form.Text className="text-muted">
-                      {"Default: 0 (none)"}
+                    <Form.Text className={TEXT_MUTED}>
+                      {`${DEFAULT}0 (${NONE})`}
                     </Form.Text>
                   )}
                 </Col>
@@ -57,22 +79,22 @@ export const EditFieldText: FC<EditFieldTextProps> = (props): ReactElement => {
             </Form.Group>
 
             <Form.Group>
-              <Form.Label>{"Default Value"}</Form.Label>
+              <Form.Label>{DEFAULT_VALUE_LABEL}</Form.Label>
               <Form.Control
-                type="text"
-                name="defaultValue"
-                placeholder="Enter the default text for this field"
+                type={TEXT}
+                name={DEFAULT_VALUE}
+                placeholder={DEFAULT_TEXT_VALUE_PLACEHOLDER}
                 onChange={handleChange}
                 onBlur={handleBlur}
                 value={values.defaultValue}
               />
               {(touched.defaultValue && errors.defaultValue && (
-                <Form.Text className="text-danger">
+                <Form.Text className={TEXT_DANGER}>
                   {errors.defaultValue}
                 </Form.Text>
               )) || (
-                <Form.Text className="text-muted">
-                  {"This is the default value of the field"}
+                <Form.Text className={TEXT_MUTED}>
+                  {DEFAULT_TEXT_LABEL}
                 </Form.Text>
               )}
             </Form.Group>
diff --git a/src/components/EditFieldForm/TypeOptionSelect.tsx b/src/components/EditFieldForm/TypeOptionSelect.tsx
index 2f24f5d..1e43d16 100644
--- a/src/components/EditFieldForm/TypeOptionSelect.tsx
+++ b/src/components/EditFieldForm/TypeOptionSelect.tsx
@@ -2,8 +2,12 @@ import { FormikProps } from "formik";
 import React, { FC, ReactElement } from "react";
 import { Form } from "react-bootstrap";
 import { initialFieldStates } from "../../store/Log";
+import { SELECT, TEXT_DANGER, TEXT_MUTED } from "../../strings";
 import { capitalizeFirstLetter } from "./../../utils";
 
+export const OPTION = "option";
+export const FIELD_TYPE = " Field Type";
+
 export interface TypeOptionSelectProps
   extends FormikProps<{ [key: string]: string }> {}
 
@@ -19,10 +23,13 @@ export const TypeOptionSelect: FC<TypeOptionSelectProps> = ({
 
   return (
     <Form.Group>
-      <Form.Label>{capitalizeFirstLetter(values.type)} Field Type</Form.Label>
+      <Form.Label>
+        {capitalizeFirstLetter(values.type)}
+        {FIELD_TYPE}
+      </Form.Label>
       <Form.Control
-        as="select"
-        name="option"
+        as={SELECT}
+        name={OPTION}
         onChange={handleChange}
         onBlur={handleBlur}
         value={values.option}
@@ -38,9 +45,9 @@ export const TypeOptionSelect: FC<TypeOptionSelectProps> = ({
         })}
       </Form.Control>
       {(touched.option && errors.option && (
-        <Form.Text className="text-danger">{errors.option}</Form.Text>
+        <Form.Text className={TEXT_DANGER}>{errors.option}</Form.Text>
       )) || (
-        <Form.Text className="text-muted">
+        <Form.Text className={TEXT_MUTED}>
           {`What type of ${values.type} field is this?`}
         </Form.Text>
       )}
diff --git a/src/components/EditFieldsTable/EditFieldsTable.tsx b/src/components/EditFieldsTable/EditFieldsTable.tsx
index 2280c26..fcf7610 100644
--- a/src/components/EditFieldsTable/EditFieldsTable.tsx
+++ b/src/components/EditFieldsTable/EditFieldsTable.tsx
@@ -1,6 +1,22 @@
 import React, { FC, ReactElement } from "react";
 import { Dropdown } from "react-bootstrap";
 import { initialFieldStates, LogFields } from "../../store/Log";
+import {
+  ACTIONS,
+  DELETE,
+  EDIT_LABEL,
+  MIDDLE,
+  NAME_LABEL,
+  REQUIRED_LABEL,
+  SECONDARY,
+  SM,
+  TEXT_DANGER,
+  TYPE_LABEL,
+  TYPE_OPTION_LABEL,
+} from "../../strings";
+
+export const YES = "Yes";
+export const NO = "No";
 
 interface EditFieldClickFunction {
   (e: React.MouseEvent<HTMLElement, MouseEvent>, field: LogFields): void;
@@ -24,32 +40,32 @@ export const EditFieldsTable: FC<EditFieldsTableProps> = ({
     <table className="table table-striped">
       <thead>
         <tr>
-          <th scope="col">Name</th>
-          <th scope="col">Type</th>
-          <th scope="col">Type Option</th>
-          <th scope="col">Required</th>
+          <th scope="col">{NAME_LABEL}</th>
+          <th scope="col">{TYPE_LABEL}</th>
+          <th scope="col">{TYPE_OPTION_LABEL}</th>
+          <th scope="col">{REQUIRED_LABEL}</th>
           <th scope="col" style={{ width: "20%" }}>
-            Actions
+            {ACTIONS}
           </th>
         </tr>
       </thead>
       <tbody>
         {fields.map((field: LogFields) => (
-          <tr key={field.id} style={{ verticalAlign: "middle" }}>
+          <tr key={field.id} style={{ verticalAlign: MIDDLE }}>
             <td>{field.name}</td>
             <td>{field.type}</td>
             <td>
               {initialFieldStates[field.type].typeOptions ? field.option : ""}
             </td>
-            <td>{field.required ? "Yes" : "No"}</td>
+            <td>{field.required ? YES : NO}</td>
             <td>
               <Dropdown>
                 <Dropdown.Toggle
-                  variant="secondary"
+                  variant={SECONDARY}
                   id="dropdown-basic"
-                  size="sm"
+                  size={SM}
                 >
-                  Actions
+                  {ACTIONS}
                 </Dropdown.Toggle>
                 <Dropdown.Menu>
                   <Dropdown.Item
@@ -58,16 +74,16 @@ export const EditFieldsTable: FC<EditFieldsTableProps> = ({
                       onEditClick(e, field);
                     }}
                   >
-                    Edit
+                    {EDIT_LABEL}
                   </Dropdown.Item>
                   <Dropdown.Item
-                    className="text-danger"
+                    className={TEXT_DANGER}
                     onClick={(e) => {
                       e.preventDefault();
                       onDeleteClick(e, field.id);
                     }}
                   >
-                    Delete
+                    {DELETE}
                   </Dropdown.Item>
                 </Dropdown.Menu>
               </Dropdown>
diff --git a/src/components/EditLabelForm/EditLabelForm.tsx b/src/components/EditLabelForm/EditLabelForm.tsx
index 6769fb3..ecfc19f 100644
--- a/src/components/EditLabelForm/EditLabelForm.tsx
+++ b/src/components/EditLabelForm/EditLabelForm.tsx
@@ -2,6 +2,21 @@ import React, { FC, ReactElement } from "react";
 import { Formik } from "formik";
 import { InputGroup, Form, Button } from "react-bootstrap";
 import { Log, LogFields } from "../../store/Log";
+import {
+  DATE,
+  DATE_LABEL,
+  DEFAULTS,
+  FIELDS,
+  LABEL_OPTIONS,
+  PRIMARY,
+  SAVE,
+  SELECT,
+  SUBMIT,
+  TEXT,
+  TEXT_LABEL,
+} from "../../strings";
+
+export const ENTRY_LABEL = "Entry Label";
 
 export interface EditLabelFormProps {
   log: Log;
@@ -14,7 +29,7 @@ export const EditLabelForm: FC<EditLabelFormProps> = ({
 }): ReactElement => {
   const { fields } = log as Log;
   const initialValues = {
-    labelOption: log.labelOption || "date",
+    labelOption: log.labelOption || DATE,
   } as Log & { [key: string]: string };
   const logFields: LogFields[] = Object.values(fields || {});
   return (
@@ -25,21 +40,21 @@ export const EditLabelForm: FC<EditLabelFormProps> = ({
       {(formikProps) => {
         return (
           <Form onSubmit={formikProps.handleSubmit}>
-            <Form.Label>Entry Label</Form.Label>
+            <Form.Label>{ENTRY_LABEL}</Form.Label>
             <InputGroup>
               <Form.Control
-                as="select"
-                name="labelOption"
+                as={SELECT}
+                name={LABEL_OPTIONS}
                 onChange={formikProps.handleChange}
                 onBlur={formikProps.handleBlur}
                 value={formikProps.values.labelOption}
                 required
               >
-                <optgroup label="Defaults">
-                  <option value="date">Date</option>
-                  <option value="text">Text</option>
+                <optgroup label={DEFAULTS}>
+                  <option value={DATE}>{DATE_LABEL}</option>
+                  <option value={TEXT}>{TEXT_LABEL}</option>
                 </optgroup>
-                <optgroup label="Fields">
+                <optgroup label={FIELDS}>
                   {logFields.map((field) => (
                     <option key={`label-options-${field.id}`} value={field.id}>
                       {field.name}
@@ -49,11 +64,11 @@ export const EditLabelForm: FC<EditLabelFormProps> = ({
               </Form.Control>
 
               <Button
-                variant="primary"
-                type="submit"
+                variant={PRIMARY}
+                type={SUBMIT}
                 disabled={formikProps.values.labelOption === log.labelOption}
               >
-                Save
+                {SAVE}
               </Button>
             </InputGroup>
           </Form>
diff --git a/src/components/FieldBoolean/FieldBoolean.tsx b/src/components/FieldBoolean/FieldBoolean.tsx
index c02b45c..f8e24be 100644
--- a/src/components/FieldBoolean/FieldBoolean.tsx
+++ b/src/components/FieldBoolean/FieldBoolean.tsx
@@ -2,6 +2,15 @@ import React, { FC, ReactElement } from "react";
 import { Form } from "react-bootstrap";
 import { FormikProps } from "formik";
 import { BooleanLogField } from "../../store/Log";
+import {
+  ASTERISK,
+  DEFAULT,
+  EMPTY,
+  SWITCH,
+  TEXT_DANGER,
+  TEXT_MUTED,
+  UNDEFINED,
+} from "../../strings";
 
 export interface FieldBooleanProps
   extends FormikProps<{ [key: string]: string }> {
@@ -12,9 +21,9 @@ export const FieldBoolean: FC<FieldBooleanProps> = (props): ReactElement => {
   const { values, errors, touched, handleChange, handleBlur } = props;
   const { id: fieldId, name, required, defaultValue } = props.field;
 
-  const fieldLabel = `${name}${required ? "*" : ""}`;
-  const defaultValueString = `Default: ${
-    typeof defaultValue === "undefined" ? false : defaultValue
+  const fieldLabel = `${name}${required ? ASTERISK : EMPTY}`;
+  const defaultValueString = `${DEFAULT}${
+    typeof defaultValue === UNDEFINED ? false : defaultValue
   }`;
 
   return (
@@ -22,7 +31,7 @@ export const FieldBoolean: FC<FieldBooleanProps> = (props): ReactElement => {
       <Form.Group>
         <Form.Label>{fieldLabel}</Form.Label>
         <Form.Check
-          type="switch"
+          type={SWITCH}
           name={fieldId}
           onChange={handleChange}
           onBlur={handleBlur}
@@ -33,9 +42,9 @@ export const FieldBoolean: FC<FieldBooleanProps> = (props): ReactElement => {
         />
 
         {(touched[fieldId] && errors[fieldId] && (
-          <Form.Text className="text-danger">{errors[fieldId]}</Form.Text>
+          <Form.Text className={TEXT_DANGER}>{errors[fieldId]}</Form.Text>
         )) || (
-          <Form.Text className="text-muted">{defaultValueString}</Form.Text>
+          <Form.Text className={TEXT_MUTED}>{defaultValueString}</Form.Text>
         )}
       </Form.Group>
     </>
diff --git a/src/components/FieldDate/FieldDate.tsx b/src/components/FieldDate/FieldDate.tsx
index fb3522a..b290783 100644
--- a/src/components/FieldDate/FieldDate.tsx
+++ b/src/components/FieldDate/FieldDate.tsx
@@ -2,6 +2,15 @@ import React, { FC, ReactElement } from "react";
 import { FormikProps } from "formik";
 import { Form } from "react-bootstrap";
 import { DateLogField } from "../../store/Log";
+import {
+  ASTERISK,
+  DEFAULT,
+  EMPTY,
+  NONE,
+  TEXT_DANGER,
+  TEXT_MUTED,
+  UNDEFINED,
+} from "../../strings";
 
 export interface FieldDateProps extends FormikProps<{ [key: string]: string }> {
   field: DateLogField;
@@ -11,10 +20,10 @@ export const FieldDate: FC<FieldDateProps> = (props): ReactElement => {
   const { values, errors, touched, handleChange, handleBlur } = props;
   const { id: fieldId, name, required, defaultValue, option } = props.field;
 
-  const defaultValueString = `Default: ${
-    typeof defaultValue === "undefined" ? "none" : defaultValue
+  const defaultValueString = `${DEFAULT}${
+    typeof defaultValue === UNDEFINED ? NONE : defaultValue
   }`;
-  const fieldLabel = `${name}${required ? "*" : ""}`;
+  const fieldLabel = `${name}${required ? ASTERISK : EMPTY}`;
 
   return (
     <>
@@ -25,13 +34,13 @@ export const FieldDate: FC<FieldDateProps> = (props): ReactElement => {
           name={fieldId}
           onChange={handleChange}
           onBlur={handleBlur}
-          value={values[fieldId] || ""}
+          value={values[fieldId] || EMPTY}
           required={required}
         />
         {(touched[fieldId] && errors[fieldId] && (
-          <Form.Text className="text-danger">{errors[fieldId]}</Form.Text>
+          <Form.Text className={TEXT_DANGER}>{errors[fieldId]}</Form.Text>
         )) || (
-          <Form.Text className="text-muted">{defaultValueString}</Form.Text>
+          <Form.Text className={TEXT_MUTED}>{defaultValueString}</Form.Text>
         )}
       </Form.Group>
     </>
diff --git a/src/components/FieldNumber/FieldNumber.tsx b/src/components/FieldNumber/FieldNumber.tsx
index 5b252a6..2f2cd91 100644
--- a/src/components/FieldNumber/FieldNumber.tsx
+++ b/src/components/FieldNumber/FieldNumber.tsx
@@ -2,6 +2,18 @@ import React, { FC, ReactElement } from "react";
 import { FormikProps } from "formik";
 import { Form, InputGroup } from "react-bootstrap";
 import { NumberLogField } from "../../store/Log";
+import {
+  ASTERISK,
+  EMPTY,
+  NUMBER,
+  RANGE,
+  TEXT_DANGER,
+  TEXT_MUTED,
+} from "../../strings";
+
+export const VALUE = "Value: ";
+export const MIN = "Min: ";
+export const MAX = "Max: ";
 
 export interface FieldNumberProps
   extends FormikProps<{ [key: string]: string }> {
@@ -21,10 +33,12 @@ export const FieldNumber: FC<FieldNumberProps> = (props): ReactElement => {
     unit,
   } = props.field;
 
-  const fieldLabel = `${name}${required ? "*" : ""}${unit ? ` (${unit})` : ""}`;
-  const valueLabel = `Value: ${values[fieldId]}`;
-  const minMaxLabel = `Min: ${min}; Max: ${max};`;
-  const isRange = option === "range";
+  const fieldLabel = `${name}${required ? ASTERISK : EMPTY}${
+    unit ? ` (${unit})` : EMPTY
+  }`;
+  const valueLabel = `${VALUE}${values[fieldId]}`;
+  const minMaxLabel = `${MIN}${min}; ${MAX}${max};`;
+  const isRange = option === RANGE;
 
   return (
     <>
@@ -47,7 +61,7 @@ export const FieldNumber: FC<FieldNumberProps> = (props): ReactElement => {
           </InputGroup>
         )) || (
           <Form.Control
-            type="number"
+            type={NUMBER}
             name={fieldId}
             onChange={handleChange}
             onBlur={handleBlur}
@@ -60,9 +74,9 @@ export const FieldNumber: FC<FieldNumberProps> = (props): ReactElement => {
         )}
 
         {(touched[fieldId] && errors[fieldId] && (
-          <Form.Text className="text-danger">{errors[fieldId]}</Form.Text>
+          <Form.Text className={TEXT_DANGER}>{errors[fieldId]}</Form.Text>
         )) || (
-          <Form.Text className="text-muted">
+          <Form.Text className={TEXT_MUTED}>
             {isRange ? valueLabel : minMaxLabel}
           </Form.Text>
         )}
diff --git a/src/components/FieldSelect/FieldSelect.tsx b/src/components/FieldSelect/FieldSelect.tsx
index 54cc5c2..a3b6cfd 100644
--- a/src/components/FieldSelect/FieldSelect.tsx
+++ b/src/components/FieldSelect/FieldSelect.tsx
@@ -2,6 +2,17 @@ import React, { FC, ReactElement } from "react";
 import { FormikProps } from "formik";
 import { Form } from "react-bootstrap";
 import { SelectLogField } from "../../store/Log";
+import {
+  ASTERISK,
+  COMMA,
+  EMPTY,
+  HYPHEN,
+  MANY,
+  TEXT_DANGER,
+  TEXT_MUTED,
+} from "../../strings";
+
+export const SELECT_AN_OPTION = "Select an option";
 
 export interface EditFieldSelectProps
   extends FormikProps<{ [key: string]: string }> {
@@ -11,9 +22,9 @@ export interface EditFieldSelectProps
 export const FieldSelect: FC<EditFieldSelectProps> = (props): ReactElement => {
   const { values, errors, touched, handleChange, handleBlur } = props;
   const { id: fieldId, name, required, option, options } = props.field;
-  const fieldLabel = `${name}${required ? "*" : ""}`;
-  const selectOptions = options.split(",").map((option) => option.trim());
-  const isMulti = option === "many";
+  const fieldLabel = `${name}${required ? ASTERISK : EMPTY}`;
+  const selectOptions = options.split(COMMA).map((option) => option.trim());
+  const isMulti = option === MANY;
   return (
     <>
       <Form.Group>
@@ -28,7 +39,7 @@ export const FieldSelect: FC<EditFieldSelectProps> = (props): ReactElement => {
         >
           {selectOptions.map((option) => (
             <option
-              key={`${fieldId}-${option.replace(/ /g, "-")}`}
+              key={`${fieldId}-${option.replace(/ /g, HYPHEN)}`}
               value={option}
             >
               {option}
@@ -36,10 +47,8 @@ export const FieldSelect: FC<EditFieldSelectProps> = (props): ReactElement => {
           ))}
         </Form.Select>
         {(touched[fieldId] && errors[fieldId] && (
-          <Form.Text className="text-danger">{errors[fieldId]}</Form.Text>
-        )) || (
-          <Form.Text className="text-muted">{"Select an option"}</Form.Text>
-        )}
+          <Form.Text className={TEXT_DANGER}>{errors[fieldId]}</Form.Text>
+        )) || <Form.Text className={TEXT_MUTED}>{SELECT_AN_OPTION}</Form.Text>}
       </Form.Group>
     </>
   );
diff --git a/src/components/FieldText/FieldText.tsx b/src/components/FieldText/FieldText.tsx
index 6f5673b..cc9f22e 100644
--- a/src/components/FieldText/FieldText.tsx
+++ b/src/components/FieldText/FieldText.tsx
@@ -2,6 +2,18 @@ import React, { FC, ReactElement } from "react";
 import { FormikProps } from "formik";
 import { Form } from "react-bootstrap";
 import { TextLogField } from "../../store/Log";
+import {
+  ASTERISK,
+  DEFAULT,
+  EMPTY,
+  INPUT,
+  NONE,
+  TEXT,
+  TEXTAREA,
+  TEXT_DANGER,
+  TEXT_MUTED,
+  UNDEFINED,
+} from "../../strings";
 
 export interface FieldTextProps extends FormikProps<{ [key: string]: string }> {
   field: TextLogField;
@@ -11,10 +23,10 @@ export const FieldText: FC<FieldTextProps> = (props): ReactElement => {
   const { values, errors, touched, handleChange, handleBlur } = props;
   const { id: fieldId, option, name, required, defaultValue } = props.field;
 
-  const inputAs = (option === "textarea" && "textarea") || "input";
-  const fieldLabel = `${name}${required ? "*" : ""}`;
-  const defaultValueString = `Default: ${
-    typeof defaultValue === "undefined" ? "none" : defaultValue
+  const inputAs = (option === TEXTAREA && TEXTAREA) || INPUT;
+  const fieldLabel = `${name}${required ? ASTERISK : EMPTY}`;
+  const defaultValueString = `${DEFAULT} ${
+    typeof defaultValue === UNDEFINED ? NONE : defaultValue
   }`;
 
   return (
@@ -22,18 +34,18 @@ export const FieldText: FC<FieldTextProps> = (props): ReactElement => {
       <Form.Group>
         <Form.Label>{fieldLabel}</Form.Label>
         <Form.Control
-          type="text"
+          type={TEXT}
           as={inputAs}
           name={fieldId}
           onChange={handleChange}
           onBlur={handleBlur}
-          value={values[fieldId] || ""}
+          value={values[fieldId] || EMPTY}
           required={required}
         />
         {(touched[fieldId] && errors[fieldId] && (
-          <Form.Text className="text-danger">{errors[fieldId]}</Form.Text>
+          <Form.Text className={TEXT_DANGER}>{errors[fieldId]}</Form.Text>
         )) || (
-          <Form.Text className="text-muted">{defaultValueString}</Form.Text>
+          <Form.Text className={TEXT_MUTED}>{defaultValueString}</Form.Text>
         )}
       </Form.Group>
     </>
diff --git a/src/components/LogNameForm/LogNameForm.tsx b/src/components/LogNameForm/LogNameForm.tsx
index 584b671..f9fc420 100644
--- a/src/components/LogNameForm/LogNameForm.tsx
+++ b/src/components/LogNameForm/LogNameForm.tsx
@@ -3,21 +3,28 @@ import { Formik } from "formik";
 import * as yup from "yup";
 import { Form, Button, InputGroup } from "react-bootstrap";
 import { Log } from "../../store/Log";
+import { EMPTY, PRIMARY, SAVE, SUBMIT, TEXT, TEXT_DANGER } from "../../strings";
+
+export const NAME = "name";
+
+export const NAME_IS_REQUIRED = "Name is required";
+export const NAME_IS_SPACES = "Name cannot be spaces";
+export const LOG_NAME = "Log Name";
 
 export const LogNameFormValidationSchema = yup.object().shape({
   name: yup
     .string()
-    .required("Name is required")
+    .required(NAME_IS_REQUIRED)
     .test(
       "is-valid-name",
-      "Name cannot just be spaces",
+      NAME_IS_SPACES,
       (value) => typeof value !== "undefined" && value.trim().length > 0
     ),
 });
 
 export interface LogNameFormProps {
   log: Log;
-  onSubmit: (log:Log, values:any) => void;
+  onSubmit: (log: Log, values: any) => void;
 }
 
 export interface LogNameFormValues {
@@ -28,18 +35,13 @@ export const LogNameForm: FC<LogNameFormProps> = ({
   onSubmit,
   log,
 }): ReactElement => {
-  if (!onSubmit) {
-    throw new Error("onSubmit is required");
-  }
   const initialValues = {
-    name: log.name || "",
+    name: log.name || EMPTY,
   } as LogNameFormValues;
   return (
     <Formik
-      initialValues={
-        initialValues
-      }
-      onSubmit={(values:any) => onSubmit(log, values)}
+      initialValues={initialValues}
+      onSubmit={(values: any) => onSubmit(log, values)}
       validationSchema={LogNameFormValidationSchema}
     >
       {({
@@ -51,28 +53,28 @@ export const LogNameForm: FC<LogNameFormProps> = ({
         handleSubmit,
       }) => (
         <Form onSubmit={handleSubmit}>
-          <Form.Label>Log Name</Form.Label>
+          <Form.Label>{LOG_NAME}</Form.Label>
           <InputGroup>
             <Form.Control
-              type="text"
-              name="name"
+              type={TEXT}
+              name={NAME}
               onChange={handleChange}
               onBlur={handleBlur}
               value={values.name}
             />
             <Button
-              variant="primary"
-              type="submit"
+              variant={PRIMARY}
+              type={SUBMIT}
               disabled={
                 Object.keys(errors).length > 0 || values.name === log.name
               }
             >
-              Save
+              {SAVE}
             </Button>
           </InputGroup>
-          {(touched.name && errors.name && (
-            <Form.Text className="text-danger">{errors.name}</Form.Text>
-          ))}
+          {touched.name && errors.name && (
+            <Form.Text className={TEXT_DANGER}>{errors.name}</Form.Text>
+          )}
         </Form>
       )}
     </Formik>
diff --git a/src/containers/Edit/Edit.tsx b/src/containers/Edit/Edit.tsx
index 3c84dfa..2b6ab52 100644
--- a/src/containers/Edit/Edit.tsx
+++ b/src/containers/Edit/Edit.tsx
@@ -16,6 +16,29 @@ import { LogNameForm } from "../../components/LogNameForm";
 import { EditFieldsTable } from "../../components/EditFieldsTable/EditFieldsTable";
 import { EditFieldForm } from "../../components/EditFieldForm";
 import { EditLabelForm } from "../../components/EditLabelForm";
+import {
+  ADD,
+  ADD_ENTRY,
+  DANGER,
+  DARK,
+  HOME,
+  MODAL,
+  PRIMARY,
+  SECONDARY,
+  SUBMIT,
+  VIEW_LOG,
+} from "../../strings";
+
+export const NEW = "new";
+export const EDIT = "edit";
+
+export const EDIT_HEADER = "Edit: ";
+export const LOG_FIELDS = "Log Fields";
+export const NO_FIELDS_YET = "No fields yet.";
+export const ADD_NEW_FIELD = "Add a new field...";
+export const LOG_SETTINGS = "Log Settings";
+export const DELETE_LOG = "Delete Log";
+export const FIELD_SETTINGS = "Field Settings";
 
 export const onUpdateLog = (log: Log, values: any): void => {
   const updatedLog: Log = {
@@ -49,14 +72,14 @@ export const Edit: FC = (): ReactElement => {
 
   const [showModal, setShowModal] = React.useState(fid ? true : false);
   const [modalMode, setModalMode] = React.useState(
-    fid && fid !== "new" ? "edit" : "add"
+    fid && fid !== NEW ? EDIT : ADD
   ); // "add" or "edit"
   const [fieldId, setFieldId] = React.useState(fid && fid !== "new" ? fid : "");
 
   const resetModal = () => {
     setShowModal(false);
     navigate(`/log/${id}/edit`);
-    setModalMode("add");
+    setModalMode(ADD);
     setFieldId("");
   };
 
@@ -66,14 +89,14 @@ export const Edit: FC = (): ReactElement => {
   ) => {
     navigate(`/log/${log.id}/edit/field/${field.id}`);
     setShowModal(true);
-    setModalMode("edit");
+    setModalMode(EDIT);
     setFieldId(field.id);
   };
 
   const onAddField = () => {
     navigate(`/log/${log.id}/edit/field/new`);
     setShowModal(true);
-    setModalMode("add");
+    setModalMode(ADD);
     setFieldId("");
   };
 
@@ -82,7 +105,10 @@ export const Edit: FC = (): ReactElement => {
   return (
     <>
       <Container>
-        <h1>{`Edit: ${log.name}`}</h1>
+        <h1>
+          {EDIT_HEADER}
+          {log.name}
+        </h1>
 
         <Accordion
           alwaysOpen
@@ -92,7 +118,7 @@ export const Edit: FC = (): ReactElement => {
         >
           <Accordion.Item eventKey="0">
             <Accordion.Header>
-              <h2>Log Fields</h2>
+              <h2>{LOG_FIELDS}</h2>
             </Accordion.Header>
             <Accordion.Body>
               {fields && fields.length ? (
@@ -105,23 +131,23 @@ export const Edit: FC = (): ReactElement => {
                   onEditClick={onEditField}
                 />
               ) : (
-                <p>No fields yet.</p>
+                <p>{NO_FIELDS_YET}</p>
               )}
               <Button
-                variant="primary"
+                variant={PRIMARY}
                 onClick={onAddField}
-                data-toggle="modal"
+                data-toggle={MODAL}
                 data-target="#addFieldModal"
                 style={{ marginBottom: "1rem" }}
               >
-                Add a new field...
+                {ADD_NEW_FIELD}
               </Button>
             </Accordion.Body>
           </Accordion.Item>
 
           <Accordion.Item eventKey="1">
             <Accordion.Header>
-              <h2>Log Settings</h2>
+              <h2>{LOG_SETTINGS}</h2>
             </Accordion.Header>
             <Accordion.Body>
               <LogNameForm onSubmit={onUpdateLog} log={log} />
@@ -129,11 +155,11 @@ export const Edit: FC = (): ReactElement => {
               <EditLabelForm log={log} onSubmit={onUpdateLog} />
               <br />
               <Button
-                variant="danger"
-                type="submit"
+                variant={DANGER}
+                type={SUBMIT}
                 onClick={(e) => (onDeleteLog(e, log), navigate("/"))}
               >
-                Delete Log
+                {DELETE_LOG}
               </Button>
             </Accordion.Body>
           </Accordion.Item>
@@ -141,24 +167,24 @@ export const Edit: FC = (): ReactElement => {
 
         <Row className="edit__button_row">
           <Col>
-            <Button variant="dark" onClick={() => navigate(`/`)}>
-              Home
+            <Button variant={DARK} onClick={() => navigate(`/`)}>
+              {HOME}
             </Button>
           </Col>
           <Col>
             <Button
-              variant="secondary"
+              variant={SECONDARY}
               onClick={() => navigate(`/log/${log.id}`)}
             >
-              View Log
+              {VIEW_LOG}
             </Button>
           </Col>
           <Col>
             <Button
-              variant="primary"
+              variant={PRIMARY}
               onClick={() => navigate(`/log/${id}/entry`)}
             >
-              Add Entry
+              {ADD_ENTRY}
             </Button>
           </Col>
         </Row>
@@ -166,7 +192,7 @@ export const Edit: FC = (): ReactElement => {
 
       <Modal id="addFieldModal" show={showModal} onHide={resetModal}>
         <Modal.Header closeButton>
-          <Modal.Title>Field Settings</Modal.Title>
+          <Modal.Title>{FIELD_SETTINGS}</Modal.Title>
         </Modal.Header>
         <Modal.Body>
           <EditFieldForm
diff --git a/src/containers/Home/Home.tsx b/src/containers/Home/Home.tsx
index 6526dd7..bd4c68c 100644
--- a/src/containers/Home/Home.tsx
+++ b/src/containers/Home/Home.tsx
@@ -7,6 +7,16 @@ import { Button, ButtonGroup, Dropdown } from "react-bootstrap";
 import { Link, useNavigate } from "react-router-dom";
 import { removeLog, useGetLogsArray } from "../../store/Log";
 import store from "../../store/store";
+import { ADD_ENTRY, PRIMARY } from "../../strings";
+
+export const TRACKER_KEEPER = "Tracker Keeper";
+export const YOUR_LOGS = "Your Logs";
+export const LOG = "Log";
+export const ACTIONS = "Actions";
+export const EDIT = "Edit";
+export const DELETE = "Delete";
+export const NO_LOGS_YET = "No logs yet.";
+export const CREATE_NEW_LOG = "Create a new log...";
 
 export const Home: FC = (): ReactElement => {
   const navigate = useNavigate();
@@ -16,15 +26,15 @@ export const Home: FC = (): ReactElement => {
     <Container>
       <Row>
         <Col>
-          <h1>Tracker Keeper</h1>
-          <hr /> 
-          <h2>Your logs</h2>
+          <h1>{TRACKER_KEEPER}</h1>
+          <hr />
+          <h2>{YOUR_LOGS}</h2>
 
           <table className="table table-striped">
             <thead>
               <tr>
-                <th>Log</th>
-                <th>Actions</th>
+                <th>{LOG}</th>
+                <th>{ACTIONS}</th>
               </tr>
             </thead>
             <tbody>
@@ -42,14 +52,14 @@ export const Home: FC = (): ReactElement => {
                         className="table__dropdown_button"
                       >
                         <Button
-                          variant="primary"
+                          variant={PRIMARY}
                           onClick={() => navigate(`/log/${log.id}/entry`)}
                         >
-                          Add Entry
+                          {ADD_ENTRY}
                         </Button>
                         <Dropdown.Toggle
                           split
-                          variant="primary"
+                          variant={PRIMARY}
                           id={`table__dropdown_toggle__${log.id}`}
                           className="table__dropdown_toggle"
                         />
@@ -58,7 +68,7 @@ export const Home: FC = (): ReactElement => {
                           <Dropdown.Item
                             onClick={() => navigate(`/log/${log.id}/edit`)}
                           >
-                            Edit
+                            {EDIT}
                           </Dropdown.Item>
                           <Dropdown.Item
                             className="text-danger"
@@ -67,7 +77,7 @@ export const Home: FC = (): ReactElement => {
                               store.dispatch(removeLog({ logId: log.id }));
                             }}
                           >
-                            Delete
+                            {DELETE}
                           </Dropdown.Item>
                         </Dropdown.Menu>
                       </Dropdown>
@@ -76,16 +86,16 @@ export const Home: FC = (): ReactElement => {
                 ))}
             </tbody>
           </table>
-          {logs && logs.length === 0 && <p>No logs yet.</p>}
+          {logs && logs.length === 0 && <p>{NO_LOGS_YET}</p>}
 
           <Button
-            variant="primary"
+            variant={PRIMARY}
             onClick={(e) => {
               e.preventDefault();
               navigate("/log/new");
             }}
           >
-            Create a new log...
+            {CREATE_NEW_LOG}
           </Button>
         </Col>
       </Row>
diff --git a/src/containers/Log/Log.tsx b/src/containers/Log/Log.tsx
index e606506..b7c442a 100644
--- a/src/containers/Log/Log.tsx
+++ b/src/containers/Log/Log.tsx
@@ -17,6 +17,26 @@ import {
   LogEntry,
 } from "../../store/Log";
 import "./log.scss";
+import {
+  ACTIONS,
+  ADD_ENTRY,
+  BOOLEAN,
+  DARK,
+  DATE,
+  DELETE_ENTRY,
+  EDIT_ENTRY,
+  EDIT_LOG,
+  FALSE,
+  HOME,
+  HYPHEN,
+  PRIMARY,
+  SECONDARY,
+  SELECT,
+  TEXT,
+} from "../../strings";
+
+export const ENTRIES_HEADER = "Entries ";
+export const NO_ENTRIES = "No entries";
 
 export const onDeleteEntry = (log: LogType, entryId: string) => {
   store.dispatch(removeLogEntry({ logId: log.id, entryId }));
@@ -29,8 +49,8 @@ export const Log: FC = (): ReactElement => {
   const { name, fields, labelOption } = log;
   const entries: LogEntry[] = Object.values(log.entries || {});
   const hasEntries = entries.length > 0;
-  const isLabelDate = labelOption === "date";
-  const isLabelText = labelOption === "text";
+  const isLabelDate = labelOption === DATE;
+  const isLabelText = labelOption === TEXT;
   return (
     <Container className="log__container">
       <Row>
@@ -41,13 +61,19 @@ export const Log: FC = (): ReactElement => {
       <hr />
       <Row>
         <Col className="log__entries">
-          <h4>{`Entries (${entries.length})`}</h4>
+          <h4>
+            {ENTRIES_HEADER}
+            {`(${entries.length})`}
+          </h4>
           {hasEntries ? (
             entries
               .filter((entry: LogEntry) => entry && entry.values)
               .sort((a: LogEntry, b: LogEntry) => {
                 // Sort by date created
-                return new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime();
+                return (
+                  new Date(b.createdAt).getTime() -
+                  new Date(a.createdAt).getTime()
+                );
               })
               .map((entry: LogEntry) => {
                 const labelText = isLabelDate
@@ -57,7 +83,7 @@ export const Log: FC = (): ReactElement => {
                   : entry.values[labelOption as string];
 
                 return (
-                  <Card key={id + "-" + entry.id} className="log__entry">
+                  <Card key={id + HYPHEN + entry.id} className="log__entry">
                     <Card.Body>
                       <Card.Title>{labelText}</Card.Title>
 
@@ -66,17 +92,19 @@ export const Log: FC = (): ReactElement => {
                         .map((fieldId: string) => {
                           let value;
                           switch (fields[fieldId].type) {
-                            case "date":
+                            case DATE:
                               value = new Date(
                                 entry.values[fieldId] as string
                               ).toLocaleString();
                               break;
-                            case "boolean":
-                              value = entry.values[fieldId] || "false";
+                            case BOOLEAN:
+                              value = entry.values[fieldId] || FALSE;
                               break;
-                            case "select":
+                            case SELECT:
                               value = Array.isArray(entry.values[fieldId])
-                                ? ((entry.values[fieldId] as []) || []).join(", ")
+                                ? ((entry.values[fieldId] as []) || []).join(
+                                    ", "
+                                  )
                                 : entry.values[fieldId];
                               break;
                             default:
@@ -85,7 +113,7 @@ export const Log: FC = (): ReactElement => {
 
                           return (
                             <div
-                              key={entry.id + "-" + fieldId}
+                              key={entry.id + HYPHEN + fieldId}
                               className="log__entry__field"
                             >
                               <strong>{fields[fieldId].name}</strong>:
@@ -95,8 +123,8 @@ export const Log: FC = (): ReactElement => {
                         })}
                       <DropdownButton
                         id={`dropdown-basic-button-${id}-${entry.id}`}
-                        title="Actions"
-                        variant="secondary"
+                        title={ACTIONS}
+                        variant={SECONDARY}
                         className="log__entry__actions"
                       >
                         <Dropdown.Item
@@ -104,12 +132,12 @@ export const Log: FC = (): ReactElement => {
                             navigate(`/log/${id}/entry/${entry.id}`)
                           }
                         >
-                          Edit Entry
+                          {EDIT_ENTRY}
                         </Dropdown.Item>
                         <Dropdown.Item
                           onClick={() => onDeleteEntry(log, entry.id)}
                         >
-                          Delete Entry
+                          {DELETE_ENTRY}
                         </Dropdown.Item>
                       </DropdownButton>
                     </Card.Body>
@@ -117,7 +145,7 @@ export const Log: FC = (): ReactElement => {
                 );
               })
           ) : (
-            <p>No entries</p>
+            <p>{NO_ENTRIES}</p>
           )}
         </Col>
       </Row>
@@ -125,30 +153,30 @@ export const Log: FC = (): ReactElement => {
       <Row className="form__button_row">
         <Col>
           <Button
-            variant="dark"
+            variant={DARK}
             onClick={() => {
               navigate(`/`);
             }}
           >
-            Home
+            {HOME}
           </Button>
         </Col>
         <Col>
           <Button
-            variant="secondary"
+            variant={SECONDARY}
             onClick={() => {
               navigate(`/log/${id}/edit`);
             }}
           >
-            Edit Log
+            {EDIT_LOG}
           </Button>
         </Col>
         <Col>
           <Button
-            variant="primary"
+            variant={PRIMARY}
             onClick={() => navigate(`/log/${id}/entry`)}
           >
-            Add Entry
+            {ADD_ENTRY}
           </Button>
         </Col>
       </Row>
diff --git a/src/containers/LogEntry/LogEntry.tsx b/src/containers/LogEntry/LogEntry.tsx
index 8d18181..8037316 100644
--- a/src/containers/LogEntry/LogEntry.tsx
+++ b/src/containers/LogEntry/LogEntry.tsx
@@ -21,6 +21,25 @@ import { FieldNumber } from "../../components/FieldNumber";
 import { FieldDate } from "../../components/FieldDate";
 import { FieldBoolean } from "../../components/FieldBoolean";
 import { FieldSelect } from "../../components/FieldSelect";
+import {
+  BOOLEAN,
+  CANCEL,
+  DATE,
+  NUMBER,
+  PRIMARY,
+  RESET,
+  SECONDARY,
+  SELECT,
+  SUBMIT,
+  SUBMIT_STRING,
+  TEXT,
+  UNDEFINED,
+} from "../../strings";
+
+export const LABEL = "label";
+
+export const ENTRY_HEADER = " Entry";
+export const ENTRY_LABEL = "Entry Label";
 
 export const onLogEntrySubmit = (
   values: { [fieldId: string]: FieldValue; label: string },
@@ -60,7 +79,7 @@ export const LogEntry: FC = (): ReactElement | null => {
   const entry: LogEntryType = useGetLogEntry(logId, entryId);
   const [cancel, setCancel] = React.useState(false);
   const [isNewEntry] = React.useState(
-    typeof entryId === "undefined" || typeof entry === "undefined"
+    typeof entryId === UNDEFINED || typeof entry === UNDEFINED
   );
 
   const { name, fields, labelOption } = log;
@@ -91,7 +110,10 @@ export const LogEntry: FC = (): ReactElement | null => {
       <Container>
         <Row>
           <Col>
-            <h1>{`${name} Entry`}</h1>
+            <h1>
+              {name}
+              {ENTRY_HEADER}
+            </h1>
             <hr />
           </Col>
         </Row>
@@ -103,7 +125,7 @@ export const LogEntry: FC = (): ReactElement | null => {
           }}
         >
           {(formikProps) => {
-            const isTextLabel = labelOption === "text";
+            const isTextLabel = labelOption === TEXT;
             return (
               <Form
                 onSubmit={formikProps.handleSubmit}
@@ -113,10 +135,10 @@ export const LogEntry: FC = (): ReactElement | null => {
                   <Col>
                     {isTextLabel && (
                       <Form.Group>
-                        <Form.Label>Entry Label</Form.Label>
+                        <Form.Label>{ENTRY_LABEL}</Form.Label>
                         <Form.Control
-                          type="text"
-                          name="label"
+                          type={TEXT}
+                          name={LABEL}
                           onChange={formikProps.handleChange}
                           onBlur={formikProps.handleBlur}
                           value={formikProps.values.label}
@@ -128,19 +150,19 @@ export const LogEntry: FC = (): ReactElement | null => {
 
                       return (
                         <Form.Group key={id}>
-                          {type === "text" && (
+                          {type === TEXT && (
                             <FieldText {...formikProps} field={field} />
                           )}
-                          {type === "number" && (
+                          {type === NUMBER && (
                             <FieldNumber {...formikProps} field={field} />
                           )}
-                          {type === "date" && (
+                          {type === DATE && (
                             <FieldDate {...formikProps} field={field} />
                           )}
-                          {type === "boolean" && (
+                          {type === BOOLEAN && (
                             <FieldBoolean {...formikProps} field={field} />
                           )}
-                          {type === "select" && (
+                          {type === SELECT && (
                             <FieldSelect {...formikProps} field={field} />
                           )}
                         </Form.Group>
@@ -152,16 +174,16 @@ export const LogEntry: FC = (): ReactElement | null => {
                 <Row className="form__button_row">
                   <Col>
                     <Button
-                      variant="secondary"
-                      type="reset"
+                      variant={SECONDARY}
+                      type={RESET}
                       onClick={() => setCancel(true)}
                     >
-                      Cancel
+                      {CANCEL}
                     </Button>
                   </Col>
                   <Col>
-                    <Button variant="primary" type="submit">
-                      Submit
+                    <Button variant={PRIMARY} type={SUBMIT}>
+                      {SUBMIT_STRING}
                     </Button>
                   </Col>
                 </Row>
diff --git a/src/containers/New/New.tsx b/src/containers/New/New.tsx
index fdf466e..5f4216e 100644
--- a/src/containers/New/New.tsx
+++ b/src/containers/New/New.tsx
@@ -10,6 +10,13 @@ import { Form, Button } from "react-bootstrap";
 import { NavigateFunction, useNavigate } from "react-router-dom";
 import store from "../../store/store";
 import { addLog } from "../../store/Log";
+import { CANCEL, PRIMARY, SECONDARY, SUBMIT, TEXT, TEXT_MUTED } from "../../strings";
+
+export const NEW_LOG = "New Log";
+export const LOG_NAME_LABEL = "Log Name";
+export const LOG_NAME_PLACEHOLDER = "Enter log name";
+export const LOG_NAME_HELP_TEXT = "What is the name of this log?";
+export const CREATE_LOG = "Create Log";
 
 export const onCreateLog = (e: any, navigate: NavigateFunction) => {
   e.preventDefault();
@@ -30,28 +37,30 @@ export const New: FC = (): ReactElement => {
     <Container>
       <Row>
         <Col>
-          <h1>New Log</h1>
+          <h1>{NEW_LOG}</h1>
           <Form>
             <Form.Group controlId="formBasicName">
-              <Form.Label>Log Name</Form.Label>
-              <Form.Control type="text" placeholder="Enter log name" />
-              <Form.Text className="text-muted">
-                This is the name of the log.
+              <Form.Label>{LOG_NAME_LABEL}</Form.Label>
+              <Form.Control type={TEXT} placeholder={LOG_NAME_PLACEHOLDER} />
+              <Form.Text className={TEXT_MUTED}>
+                {LOG_NAME_HELP_TEXT}
               </Form.Text>
             </Form.Group>
             <br />
             <Button
-              variant="secondary"
+              variant={SECONDARY}
               onClick={() => navigate("/")}
               className="mr-2"
-            >Cancel</Button>
+            >
+              {CANCEL}
+            </Button>
             &nbsp;
             <Button
-              variant="primary"
-              type="submit"
+              variant={PRIMARY}
+              type={SUBMIT}
               onClick={(e) => onCreateLog(e, navigate)}
             >
-              Create Log
+              {CREATE_LOG}
             </Button>
           </Form>
         </Col>
diff --git a/src/index.tsx b/src/index.tsx
index 9a76fad..34c3c7d 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -6,11 +6,12 @@ import { PersistGate } from "reduxjs-toolkit-persist/integration/react";
 
 import { App } from "./App";
 import reportWebVitals from "./reportWebVitals";
-import * as serviceWorkerRegistration from './serviceWorkerRegistration';
-
+import * as serviceWorkerRegistration from "./serviceWorkerRegistration";
+import { FALSE } from "./strings";
 
+const ROOT: string = "root";
 const root: ReactDOM.Root = ReactDOM.createRoot(
-  document.getElementById("root") as Element | DocumentFragment
+  document.getElementById(ROOT) as Element | DocumentFragment
 );
 root.render(
   <Provider store={store}>
@@ -30,5 +31,5 @@ serviceWorkerRegistration.register();
 // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
 reportWebVitals();
 
-// 
-document.getElementById("root")?.setAttribute("aria-busy", "false");
+//
+document.getElementById(ROOT)?.setAttribute("aria-busy", FALSE);
diff --git a/src/strings.ts b/src/strings.ts
new file mode 100644
index 0000000..f7761fa
--- /dev/null
+++ b/src/strings.ts
@@ -0,0 +1,68 @@
+// Magic Strings
+export const PRIMARY = "primary";
+export const SECONDARY = "secondary";
+export const DANGER = "danger";
+export const DARK = "dark";
+export const TEXT_DANGER = "text-danger";
+export const TEXT_MUTED = "text-muted";
+export const TYPE = "type";
+export const SUBMIT = "submit";
+export const RESET = "reset";
+export const MODAL = "modal";
+export const DATE = "date";
+export const TEXT = "text";
+export const TEXTAREA = "textarea";
+export const INPUT = "input";
+export const NUMBER = "number";
+export const RANGE = "range";
+export const BOOLEAN = "boolean";
+export const SWITCH = "switch";
+export const SELECT = "select";
+export const TRUE = "true";
+export const FALSE = "false";
+export const EMPTY = "";
+export const ASTERISK = "*";
+export const HYPHEN = "-";
+export const UNDEFINED = "undefined";
+export const NONE = "none";
+export const MANY = "many";
+export const LABEL_OPTIONS = "labelOptions";
+export const MIDDLE = "middle";
+export const SM = "sm";
+export const MIN = "min";
+export const MAX = "max";
+export const STEP = "step";
+export const COMMA = ",";
+export const COMMA_SPACE = ", ";
+export const ADD = "add";
+
+// Display Strings
+export const HOME = "Home";
+export const EDIT_LOG = "Edit Log";
+export const VIEW_LOG = "View Log";
+export const ADD_ENTRY = "Add Entry";
+export const EDIT_ENTRY = "Edit Entry";
+export const DELETE_ENTRY = "Delete Entry";
+export const ACTIONS = "Actions";
+export const SUBMIT_STRING = "Submit";
+export const SAVE = "Save";
+export const CANCEL = "Cancel";
+export const DELETE = "Delete";
+export const DEFAULT = "Default: ";
+export const DEFAULTS = "Defaults";
+export const FIELD = "Field";
+export const FIELDS = "Fields";
+export const NAME_LABEL = "Name";
+export const DATE_LABEL = "Date";
+export const TEXT_LABEL = "Text";
+export const NUMBER_LABEL = "Number";
+export const SELECT_LABEL = "Select";
+export const BOOLEAN_LABEL = "Boolean";
+export const TYPE_LABEL = "Type";
+export const TYPE_OPTION_LABEL = "Type Option";
+export const REQUIRED_LABEL = "Required";
+export const EDIT_LABEL = "Edit";
+export const NONE_LABEL = "None";
+export const STEPS_LABEL = "Steps";
+export const CREATE_LABEL = "Create";
+export const UPDATE_LABEL = "Update";